How to Add Reusable Content Block in X Theme & Cornerstone

Working every day with X Theme and Cornerstone, I frequently find myself needing to re-use sections of my content on different parts of my website. While I know that IĀ couldĀ save a block of Cornerstone content as a template and re-use it, the problem is that it wouldn’t update whenever I redid the master template.

So how do we solve this problem? With a custom shortcode, of course! Basically you will just be saving some basic code into your functions that will allow you to use a custom shortcode that will output the contents of an existing page. This page is where we’ll add all the content we need to re-use. This solution is extremely simple and light-weight.

Let’s get started! First, you’ll need to add the following code into your child theme’s functions.php file, right at the end:

Easy!

Now, just set up a new page on your website. It shouldn’t matter too much what you specify as the template, because only the content will be reused. I recommend setting it to the template of all the pages you’re going to add this to, so that it’s easier to visualize. Add all of the content you’re going to want repeated directly to this page. For our purposes we’re using Cornerstone, though there’s actually no reason this shouldn’t work for regular content as well.

Once it’s ready and published, from the backend edit screen, take note of the page ID. Usually the address will be something like:

You want that number, in this case ‘1234’.

Now all we have to do is add our shortcode to the page we want this to appear! I’ve found that you want to put this in a “Text” element by itself. A raw HTML element will not render the Cornerstone code! In my example, the shortcode would be:

Voila! That block will now appear on that page no problem, and all Cornerstone elements will even be rendered properly. Every time you update the page with the content block, it will be updated on all pages using this shortcode. Pretty nifty, huh?

What if my content is supposed to be full-width?

Great question! If you have sections and content that need to be full width, all you need to do is go to the “ROW” settings for the row that contains your text element, and for “Column Container” choose “OFF” and for “Marginless Columns” ensure “Off” is selected as well. Make sure you save!

I’ve found that sometimes this setting doesn’t take effect properly, so you may want to toggle it on and off a few times and save between each.

Also note, that the page clearly needs to be set to one of the templates with “No Container” otherwise none of your content will be full-width. That applies to all pages though and is not unique to what we’re doing here.

Let me know if this works for you in the comments!

About Brian Johnson

Brian Johnson is a website developer and designer living in Minneapolis, Minnesota with a passion for code and WordPress. He spends his days building WordPress websites for small businesses, developing new code with the online community, and living life.

28 Comments on “How to Add Reusable Content Block in X Theme & Cornerstone”

  1. Hello Brian

    I’ve tried to make this work, but my site just shows “[content_block id=”350″]” without showing the content of that page.

    I’ve added the code to my theme’s functions.php;
    I’m using the X theme and designing a front page with Cornerstone;
    Am sure that the page id is 350.
    Added the shortcode inside of a text-element.

    Any idea as to what might be wrong?

  2. Hi Brian, by using above method I had created a page, but indeed my page doesn’t got indexed from Google. So what will be the issue can you please let me know

  3. Hi Brain

    Thank you for this wonderful post. Can I put Global Blocks shortcode in such a way so that all posts (not pages) show the content just above the comment box (or, you can say just below the content).

    Thanking you
    SL.

  4. Hi Brian,

    I’ve been trying to find a way to incorperate the content of a latest blog-post on a certain page (both build with cornerstone/ pro theme) using a custom shortcode. I can’t get it to work, it just outputs {{base64content “” }}. If I write the content of the post with the classic WP editor it does work using get_the_content();

    I’ve contacted support, but they say it’s not possible due to the way cornerstone wraps content in all sorts of divs.

    Then I found your article doing almost the same thing (I don’t know if you are using xtheme or pro?), so I tried your method with a simple new page created in cornerstone and added your shortcode to a text element on another page. It also just outputs {{base64content “” }}.

    Could it be that this only works in the old xtheme with cornerstone as a plugin?

    Here’s the code for my custom shortcode:

    function latest_post_content_shortcode_handler( $atts, $content = null ) {

    $args = array( ‘posts_per_page’ => 1 );
    $custom_query = new WP_Query( $args );
    if ( $custom_query->have_posts() ) :
    while ( $custom_query->have_posts() ) : $custom_query->the_post();
    $output = get_the_content();
    // tried $output = the_content(); does the same …
    // tried $output = x_get_view( ‘global’, ‘_content’ ); does the same …

    $output = get_the_content();
    return $output;

    endwhile;
    endif;
    wp_reset_postdata();

    }
    add_shortcode(‘latest_post_content’, ‘latest_post_content_shortcode_handler’);

    If you know a way to make this work, I would be most interested!

    regards,

    Richard

  5. i created a form with visual form composer and i want to add the code to my cornerstone plugin but i have tried several ways and it dont work. i was searching for a solution and i found this post. can you kindly help me on how to make that work in my cornerstone plugin?
    \

  6. Hi there, is it possible to include the content of a custom post type (which supports cornerstone)? Because now I believe it’s only possible to include from other pages. It would be nice to have a separate post type for creating blocks and then include them into the pages. I tried changing ‘page_id’ => $atts[‘id’] to ‘post_id’ => $atts[‘id’] but no luck.

    Thanks