Collapse-O-Matic Image And Text Trigger Not showing image

This issue has been covered many, many in the forums.

it’s not a good idea to use HTML inside of a shortcode attribute, but if you must, take care of how you use double quotes and single quotes.
for example: title="<img src='...'>" vs title="<img src="...">"

For best results, you might want to check out a few of the demos we put together on the topic of images.

• This reply was modified 7 years, 7 months ago by twinpictures.

Hi, i have tried to use the shortcodes for image but it does not work. so i used the roll your own method but that does not allow me to use rel highlander. please help

add rel="groupname-highlander" to your triggers.
So, in your case:

<img id="3" class="collapseomatic noarrow" rel="ladyfit-highlander" src="https://healthclubgyms.co.uk/site/wp-content/uploads/2017/04/bodycombat.jpg">

Hi, i am doing that and it keeps removeing the rel highlander after saving the page. take a look

• This reply was modified 7 years, 7 months ago by wijhussain.

ahhh.ha! You are right, that was an issue.
How brave are you?

If you need some courage, let us know: we’re here to help.

Hi, I have tried this. Not sure where to put it. I am running jupiter5 theme and in the directory i have loaded the functions.php and added this to the end but it has no affect. Not sure if the end of the file is the correct place to place this code.

Did you just copy and paste the code, or did you read the post?

a custom function for the child theme functions.php file, which sets the allowed attributes for the container (in this case, a span tag):

So this part of the code:

$ext = 'span[id|title|class|style|rel]';

would need to be changed to:

$ext = 'img[id|title|class|style|rel]';

Hi, i cant find a functions file with this information inside it. so i am slightly confused.

OK, let’s back up a step.

First, any changes you make to your theme files will be overwritten the next time you update your theme. This is why it is highly recommended to use a child-theme. Fortunately your theme has one included. Or are you using this Jupiter theme? Well, since it’s not clear, we have to take a look at your page source, find the style.css file for your theme, and yes, it’s the theme by artbees.

So step one: Install and activate the child theme following the instructions we linked to above. Links are nice, no?

Step two, open up your child-theme’s function.php file and past in the following php code:

function custom_mce_options( $init ) {
    // Command separated string of extended elements
    $ext = 'img[id|title|class|style|rel]';

    // Add to extended_valid_elements if it already exists
    if ( isset( $init['extended_valid_elements'] ) ) {
        $init['extended_valid_elements'] .= ',' . $ext;
    } else {
        $init['extended_valid_elements'] = $ext;
    }

    // Super important: return $init!
    return $init;
}

add_filter('tiny_mce_before_init', 'custom_mce_options');

Finally let us know if you get stuck or if this resolves your issue.
If this is a bit over your head and you would like someone to help you set this up, you might consider upgrading to collapse-pro-matic as it comes with a very high level of personal support. The support alone is worth the price of the upgrade.

Hope this helps!

our last post was quite detailed, but it’s not displaying here on the forum thread. this post is just to test the system.

Update, ok, maybe it had too much info. here is a shorter version:

OK, let’s back up a step.

First, any changes you make to your theme files will be overwritten the next time you update your theme. This is why it is highly recommended to use a child-theme. Fortunately your theme has one included.

Step two, open up your child-theme’s function.php file and past in the following php code:

function custom_mce_options( $init ) {
    // Command separated string of extended elements
    $ext = 'img[id|title|class|style|rel]';

    // Add to extended_valid_elements if it already exists
    if ( isset( $init['extended_valid_elements'] ) ) {
        $init['extended_valid_elements'] .= ',' . $ext;
    } else {
        $init['extended_valid_elements'] = $ext;
    }

    // Super important: return $init!
    return $init;
}

add_filter('tiny_mce_before_init', 'custom_mce_options');

Finally let us know if you get stuck or if this resolves your issue.

If this is a bit over your head and you would like assistance in setting this up, consider upgrading to collapse-pro-matic as it comes with a very high level of personal support. The support alone is worth the price of the upgrade.

• This reply was modified 7 years, 7 months ago by twinpictures.

Hi, thank you very much, It is now fixed after some customisation of the php file. thanks

• This reply was modified 7 years, 7 months ago by wijhussain.

Glad you got it working. Issue marked (again) as resolved.
If you are happy with the plugin or its support, why not consider leaving a review!