Inline not working – expand opens on new line
-
Hi,
great plugin! Except that I can’t figure out how to make inline-expand work on this site:
When clicked, each sentence is supposed to fold out on the same line, but no matter how I change in the Collapse-code and/or CSS, it doesn’t work. Hope you can help ??
frederik
-
Could you please post your WordPress html text, please.
(NB: The official Targpos Attribute example at https://plugins.twinpictures.de/plugins/collapse-o-matic/documentation/ does not work in newest Chrome or IE.)
Ed…the way I’ve done it, it doen’t seem to work in Firefox either.
Here is the code – don’t know if it could have any influence, that it’s written inside a text block in WPbakery’s Visual Composer-plugin?:
<blockquote style="font-size: 28px;">Mit br?ndstof er at formidle [expand title="historier" trigclass="highlight, noarrow" targclass="highlight" targtag="span" targpos="inline"] , der g?r en forskel for de mennesker, der modtager dem[/expand] . Jeg g?r op i fort?llingens [expand title="platform, indhold og udtryk" trigclass="highlight, noarrow" targclass="highlight" targtag="span" targpos="inline"] ? – b?de den skarpe vinkel, de sproglige virkemidler og en god brug af sociale medier[/expand] ? – og jeg elsker at arbejde med [expand title="alle aspekter" trigclass="highlight, noarrow" targclass="highlight" targtag="span" targpos="inline"] , fra sparring om den l?se idé til det sidste punktum og evalueringen[/expand] . Inden for nyheder og kultur har jeg v?ret igangs?tter og aktiv i en lang r?kke [expand title="projekter og processer" trigclass="highlight, noarrow" targclass="highlight" targtag="span" targpos="inline"] , eksempelvis 2nd screen til Eurovision, web-tv fra musikfestivaler, dr.dks nye forside, opstart af Ekstra Bladets Nationen! og udvikling af poetry slam-scenen i K?benhavn [/expand] , og kan b?de [expand title="samarbejde, koordinere og holde" trigclass="highlight, noarrow" targclass="highlight" targtag="span" targpos="inline"] ? styr p? alle de l?se ender.[/expand]</blockquote>
Your code seems perfect and it should work. Your page is a nice example of where one would use an inline expand (although it would be easier for me to digest it if it was in English–I do not know Danish). I have discovered similar problems with Collapse-O-Matic.
I think that the key now is to communicate to the plugin author that there is a bug that needs to be fixed ASAP. The best proof is his own Targpos Attribute example at https://plugins.twinpictures.de/plugins/collapse-o-matic/documentation/ . I confirm that it does not work in IE 11.0.96 or in Chrome Version 37.0.2062.120.
Please confirm that it does not work in Firefox (specify version).
NOTE: If you adjust the browser width appropriately, the last expand (“samarbejde, koordinere og holde styr p? alle de l?se ender.”) appears on the same line! This makes me think that there is something about the width of the trigger or target text that is wrong–the browser thinks that there is not enough space to display it.
–Edwe’re on it…
Thanks Ed and Baden!
Eds notion about the last expand makes me think that the problem could be desribed like this: if there’s not room for the whole expand-text on the same line as the trigger, the expand will start on a new line. Instead it should be coded to place as many words, as there are actually room for, inline after the trigger and only shift to a new line when necessary in the specific browser/view.
f
BAM! Please download and update to Collapse-O-Matic v1.5.10b direct from The Plugin Oven: https://plugins.twinpictures.de/plugins/collapse-o-matic/
Version 1.5.10b addresses the targpos inline issue. Please get back and let us know if this resolves the issue for you.
Thanks, Baden! It works perfectly now ??
frederik
Hi Baden!
Version 1.5.10b works perfectly in IE11.0.12. BUT IT FAILS BADLY and grotesquely in Chrome 37.0.2062.120.
Using the twenty-fourteen theme, I created a page https://edhoworka.com/collapse-o-matic_example_001/ which is a literal copy of your example:
[expand title=”Laugh It Up, Fuzzball” excerpt=”Laugh It Up, Fuzzball: The Family Guy Trilogy” targtag=”span” targpos=”inline”]. Three episode specials from the American animated television series Family Guy. The episodes are a remake parody of the original Star Wars films.[/expand]
YOUR example at https://plugins.twinpictures.de/plugins/collapse-o-matic/documentation/ works fine in Chrome, however! Are you using some additional tricks? Pray tell.
@ehoworka:
Here is an example of how you get it to work with twenty-fourteen:
https://spacedonkey.de/737/collapse-o-matic-target-tag-target-position-test/Pay attention to the special span_fix class that has been defined and assigned to the target using the targclass. Let us know if this squares you away, of if you still require assistance.
@baden
Thank you, I got it to work, so Version 1.5.10b has my blessing.
What bugs me is that it did not work out of the box using the most popular browser (Chrome) and the official WP theme (twenty-fourteen)!Please note that, in Chrome, CSS code in https://spacedonkey.de/737/collapse-o-matic-target-tag-target-position-test/ is required even in simple (non-inline) examples where the trigger is at the end of a paragraph, as in https://edhoworka.com/about/patents/ where I use Collapse-O-Matic extensively. The key (at least in twenty-fourteen) is to add .myclass:before, .myclass:after { content: none; } to any custom myclass one uses for trigger and/or target text.
Another thing that we should all pay attention to is that it is not enough to test with just one browser! After spending considerable time massaging CSS to make Collapse-O-Matic work in IE11, I was horrified to see how broken my site looked in Chrome (until you came to the rescue).
Thank you for this wonderful plugin and the fantastic and lightning fast support you provide.
Great! Yes, it’s because the twenty-fourteen theme adds ::before and ::after pseudo classes to the
span
element. We will go ahead and push out the official update to the plugin today. Please consider leaving a plugin/plugin support review to help spread the word!Issue marked as resolved.
- The topic ‘Inline not working – expand opens on new line’ is closed to new replies.