Collapse-o-matic IMG2 75910
The new field display plugin is much more effcient with respecting no-line breaks (eg. acf_quote was not OK as wysiwyg when following acf_txt1 and broke the line)
| Collapse-o-matic IMG2 |  Categories: Uncategorized | 
Collapse-o-matic IMG2 ℗ …..  … [ expand   … ]
IMPORTANT: Archive of releases -› pluginarchive.com/wordpress/jquery-collapse-o-matic This is an example of some text as an in-line trigger expand title=”in-line trigger” tag=”span” targtag=”span” targpos=”inline” trigclass=”my_trigger span_fix noarrow” targclass=”span_fix” with some text at the end.
  • 1. The rel attribute|
    The rel attribute is used to group related expand elements by the assigned value. Expanding a member of one group will automatically collapse any expanded elements that belong to another group.
  • 1. Accordion groupings with rel and id
    expand title=”1.” swaptitle=”Close” tag=”div” alt=”.” rel=”1″ id=”1″ elwraptag=”li”
  • 2
    expand title=”2″ rel=”2″ id=”2″ elwraptag=”li”
  • 3
    expand title=”3″ rel=”3″ id=”3″ elwraptag=”li”
  • 3bis
    expand title=”3bis” rel=”3″ id=”4″ elwraptag=”li”
  • 5. su_post variables
    expand title=”5″ rel=”4″ id=”5″ elwraptag=”li”
    Preview spoiler, created on 2021-10-27 22:51:26      su_post field=”post_title” post_id=”59599″,     su_post field=”post_date” post_id=”59599″:
  • 1.b | F_59599 Using 'rel' grouping

    Preview spoiler ≥ Edit-59599

    Preview spoiler Nested SC with Curly brackets

    ACF_Txt2 › [ fl_builder_insert_layout id=”43343″]

      Custom Fields1 Base fields
    Preview spoiler
    ▷ acf_txt1
    ▷ acf_img
    ▷ acf_quote

    ▷2 Preview spoiler : 59599 The objective is to design a highly useable spoiler solution for remote news and article previews in the article inserts page.

    ▷ acf_wys2
    acf_nb: 1.  |   acf_id: 59599
    ▷ acf_nb · acf_id

    https://iorelys.com/wp-admin/post.php?post=59599&action=edit

    ▷ acf_editpost
    Img 1,2,3, logo
    ▷ acf_img1
    ▷ acf_img2
    ▷ acf_img3
    ▷ acf_logo
    ▷ wpbb post:featured_image
    Edit FLB Template R_acf1 |   Popup R_acf1 |  id=43343
      Custom Fields2: Assembled
    ACF_Wys: 1, 3
    Distribute▷1: To multiple sites
    ▷ acf_wys1
    Preview spoiler : 59599 ▷3 ØfL1 | Øsub3
    ▷ acf_wys3

    ▷5

    ▷ acf_wys5
    ACF_Wys: 2, 4

    ▷2 Preview spoiler : 59599 The objective is to design a highly useable spoiler solution for remote news and article previews in the article inserts page.

    ▷ acf_wys2

    The acf_txt1 title is entered both via [ wpbb post:title] – and – manually. There are issues in certain remote post calls with the wpbb post:title in acf_txt1. ▷4

    ▷ acf_wys4

    Preview spoiler : 59599

    ▷ acf_wys6
    Combination of 3 BeaverB columns, each containing LGC Columns
      Code Snippets Cardlet1

    Distribute▷1: To multiple sites

    ▷2 Preview spoiler : 59599 The objective is to design a highly useable spoiler solution for remote news and article previews in the article inserts page.

    59599 Edit xyz-snippet cardlet1
    Edit Cardlet1 |   Popup Cardlet1 | id13
    Snippets Manage All |   Popup Code Snippets Manage
      Code Snippets Cardframework2
    Preview spoiler
    Preview spoiler : 59599 ▷3 ØfL1 | Øsub3

    The acf_txt1 title is entered both via [ wpbb post:title] – and – manually. There are issues in certain remote post calls with the wpbb post:title in acf_txt1. ▷4

    59599 | 59599
    Edit Cardframework2 |   Popup Cardframework2 | id11
    Snippets Manage All |   Popup Code Snippets Manage

  • 1.b | F_75910 Using 'rel' grouping

    See post ≥ Edit-75910

    Collapse-o-matic IMG2 Nested SC with Curly brackets
    Collapse-o-matic IMG2  id=75910
    acf_img3 ▷img3 ØfL1 | Øsub3

    This text is located in ACF_Wys4. Picture LAKE.jpg to the left is from ACF_Wys3 The major annoyance with field acf_txt1 when using the shortcode [  wpbb post:title ] is now solved. The fields need to WYSIWIG to accept a working wpbb post:title ▷4

    $$ id=75910 | wpbb post:id 75910
    Edit sc cardframework2 |  Popup sc cardframework2

Spoiler Collapse-o-matic℗ IMG Line of Trigger Images
1. View sources
2. How to code the expand with an image as trigger (in this case the trigger arrow)
1 • Create each expand element using the title element as the image tag. Assign it a trigclass=”noarrow” and give it an alt attribute. 2 • Wrap each expand in a div w. unique class eg. ‘birdwire‘ to make the img’s align:   .birdwire {display:inline; float:left; margin-right:1.625em; width:160px;} ‹div class=”birdwire”›[ expand title=”< img src='http://site.com/img.jpg' / >” trigclass=”noarrow” tag=”div” alt=”name” ] Content of expand [ /expand]‹/div›
.floatwire { float:left; margin-right:0.3em; width:200px; } local ‹ div class=”floatwire” ›‹ img id=”nj1” src=” ” class=”collapseomatic” rel=”?” › ‹ /div › ‹ div id=”target-nj1” class=”collapseomatic_content ›‹ /div ›
Line of trigger images
How to code the expand with an image as trigger (in this case the trigger arrow)
1 • Create each expand element using the title element as the image tag. Assign it a trigclass=”noarrow” and give it an alt attribute. 2 • Wrap each expand in a div w. unique class eg. ‘birdwire‘ to make the img’s align:   .birdwire {display:inline; float:left; margin-right:1.625em; width:160px;} ‹div class=”birdwire”›[ expand title=”< img src='http://site.com/img.jpg' / >” trigclass=”noarrow” tag=”div” alt=”name” ] Content of expand [ /expand]‹/div›
Light.jpg▷img1: ØfL1.25% | Øsub3
▷2 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. 75910 Edit sc cardlet1

Light.jpg▷img1: ØfL1.25% | Øsub3

▷2 Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

acf_img3 ▷img3 ØfL1 | Øsub3