[jasonribeiroParticipant]

Upon updating Cornerstone from 1.1.3 to 1.2.4 on my site (www.kcmatters.com) certain shortcodes seem to no longer process correctly as can be in the attached screenshots. Please advise.

[jasonribeiroParticipant]

This reply has been marked as private.

[Rue NelModerator]

Hello There,

Thanks for writing in! Upon inspection, you have inserted the invalid shortcode. The way you inserted the shortcode what messed up the layout generated by Cornerstone. Like for example this:

And this way is not acceptable:

It is not acceptable because each of the text element has it’s own container. Doing so could potential result to invalid html which would somehow messed the whole page layout.

Hoe this helps.

[jasonribeiroParticipant]

But those shortcodes are vital to our page. Without those shortcodes, those pages are pretty much useless to our members. And the shortcodes currently work on an older version of Cornerstone. So what changed with Cornerstone that would stop those shortcodes from working and why was that change made?

[jasonribeiroParticipant]

According to what you stated above, they cannot be used inside a link field or within a text element. So how can they be used?

[Rue NelModerator]

Hello There,

You cannot use because it is invalid. It may have worked before but still you have done it wrong. Imagine this setup.

<div class="x-container   max width" style="margin: 0px auto; padding: 0px; ">
	<div class="x-column x-sm x-1-3" style="padding: 0px; ">
		<div class="x-text">[i4w_onlyfor tagid='12345']</div>
		<a class="x-creative-cta slide-top" href="/pp/profile" style="padding: 25px 25px 25px 25px; color: #ffffff; background-color: #00aeff;" data-x-element="creative_cta" data-x-params="{&quot;animation&quot;:&quot; slide-top&quot;,&quot;bg_color&quot;:&quot;#00aeff&quot;,&quot;bg_color_hover&quot;:&quot;#00aeff&quot;}"><span class="text" style="font-size: 32px;">My Profile</span><span class="graphic" style="transform: translate(-50%, -50%) scale(0);"><i style="margin: 0; font-size: 48px;" class="x-icon-user" data-x-icon=""></i></span></a>
	</div>

	<div class="x-column x-sm x-1-3" style="padding: 0px; ">
		<a class="x-creative-cta slide-top" href="#" style="padding: 25px; color: rgb(255, 255, 255); background-color: rgb(255, 42, 19);" data-x-element="creative_cta" data-x-params="{&quot;animation&quot;:&quot; slide-top&quot;,&quot;bg_color&quot;:&quot;#ff2a13&quot;,&quot;bg_color_hover&quot;:&quot;#d80f0f&quot;}"><span class="text" style="font-size: 32px;">My Homepage</span><span class="graphic" style="transform: translate(-50%, -50%) scale(0);"><i style="margin: 0; font-size: 48px;" class="x-icon-home" data-x-icon=""></i></span></a>" target="blank" color="" bg_color="#00aeff" bg_color_hover="#00aeff"]
	</div>

	<div class="x-column x-sm x-1-3" style="padding: 0px; ">
		<a class="x-creative-cta slide-top" href="/pp/rssfeed" style="padding: 25px 25px 25px 25px; color: #ffffff; background-color: rgb(255, 119, 0);" data-x-element="creative_cta" data-x-params="{&quot;animation&quot;:&quot; slide-top&quot;,&quot;bg_color&quot;:&quot;rgb(255, 119, 0)&quot;,&quot;bg_color_hover&quot;:&quot;rgb(255, 119, 0)&quot;}"><span class="text" style="font-size: 32px;">My RSS Feed</span><span class="graphic" style="transform: translate(-50%, -50%) scale(0);"><i style="margin: 0; font-size: 48px;" class="x-icon-feed" data-x-icon=""></i></span></a>

		<div class="x-text">
			<p>[/i4w_onlyfor]</p>
		</div>
	</div>
</div>

If ever the shortcode gets rendered, the resulting html will be broken because your shortcode, both the opening and closing shortcode is placed in different containers. This will definitely messed up the layout.

I am suggesting that if you use the shortcode, use it inside a text element only. Both the opening and closing of the shortcode should be within the same container. For example:

<div class="x-text">
   [i4w_onlyfor tagid='12345']

   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer scelerisque eros eu pulvinar dictum. Nunc egestas massa at elit bibendum, cursus fringilla nunc faucibus. Proin dignissim efficitur nunc a cursus. In luctus mi in nisi condimentum, sed ornare enim tempor. Praesent semper ultricies tellus, rutrum fermentum leo viverra at. Sed a venenatis ante, non aliquam tortor. Aliquam erat volutpat. Curabitur felis elit, rhoncus et molestie in, auctor euismod lorem. Etiam viverra hendrerit metus, vitae ullamcorper metus ultricies ut. Ut eu ex id ligula viverra auctor at quis urna.

   [/i4w_onlyfor]
</div>

For further information on how you can properly use this shortcode, please do check its documentation.
http://docs.imember360.com/shortcodes/regular/i4w_onlyfor/

[jasonribeiroParticipant]

I understand that this would resolve the issue in the 3rd screenshot that I posted. However, as far as the other 2 go, I need to include the shortcode as part of the link of the CTA and Button elements. How can this be done if shortcodes will no longer work within any element other than text elements?

Actually, in the first screenshot, the shortcode is in a text element, but it is still not processing correctly. Please advise.

[JackKeymaster]

Hi there,

Thanks for writing back.

One possibility would be to use the raw content element with your shortcodes within that element, so you could then have the raw content element with your button shortcode and then the additional shortcode you need, so that everything is processed within that one element, would that work for you?

Thanks!

[jasonribeiroParticipant]

I tried using the “Raw Content” element in place of the “Text” element and put the code in there, but the shortcodes still do not process correctly. Not sure if this helps, but it seems like some of them aren’t processing when there is a shortcode within a shortcode.

[RadModerator]

Hi Jason,

Some of the element’s output are cached using transient, could you try clearing your transients using Transient Cleaner plugin? The other option is to create your own cornerstone custom element to integrate your shortcode.

Like from here https://community.theme.co/kb/cornerstone-custom-elements/

Though, shortcode should work with text and raw element. It’s one of the main purposes of those elements. I also checked on my installation and shortcodes are working within it. Perhaps it’s related to what’s within your shortcode?

Thanks!

[jasonribeiroParticipant]

This reply has been marked as private.

[jasonribeiroParticipant]

I’m looking for clean shortcodes for the Creative CTA so I don’t have to copy the source code, but I see none here:
http://theme.co/x/demo/integrity/1/shortcodes/

[jasonribeiroParticipant]

I also thought it was only when a shortcode was within a shortcode, but that’s not always the case because if you go to kcmatters.com/dashboard, you’ll noticed that out of the 4 blocks at the top of the page, the one all the way to the right processes correctly, but the 2 on the left do not. I also tried swapping out the shortcodes to see if the shortcode itself was bad but that’s not the case, because it loads elsewhere.

So there must be something else at play here…

[RadModerator]

Hi there,

I’ll try explaining it, and let’s use the opening/closing as a reference.

[open] this alone is invalid, but on next element, [close] is defined. Which makes the first [open] valid even it’s implemented in a wrong way. Then a series of these appears, which of course first sets of invalid [open] will appear valid, but the last instances aren’t because there are no more [close] that makes them valid. It’s hard to explain but the short recommendation is, don’t add your shortcode as a link.

A link will be escaped and encoded to be a valid URL, and that means your shortcode will not be executed as shortcodes since it’s now encoded as a link. For example, http://domain.com/hey im not encoded/ will encoded to http://domain.com/hey%20im%20not%20encoded/

http://stackoverflow.com/questions/12335387/why-is-character-encoding-important-for-urls

When your shortcode is encoded, then it becomes a normal text. And shortcode will only be executed if it’s called by do_shortcode() https://developer.wordpress.org/reference/functions/do_shortcode/

In other words, no matter of how many shortcode you add, it will not work since do_shortcode() isn’t available on links.

Thanks!

[jasonribeiroParticipant]

Unfortunately, I don’t understand your explanation. In fact, I’m only more confused now. For the example of shortcodes I was just giving you, there is no opening or closing shortcode. It’s just a shortcode that simply pulls in a query that would normally belong at the end of a link. And you’re suggestion to just not include the shortcode in the link is not an option for us.

I don’t understand why the ability to process shortcodes was just removed in the latest version of Cornerstone. I can’t be the only one who has a major issue with this.

[Author]

Posts