How to embed a component into your ProBlog posts

Posted By: ChadStrat avatar

Published to Programming on Jun 11, 2014

blog_post_3

With ProBlog for October CMS you can actually attach components to your posts. Lets take a look at how this works and why it's really cool.

An Example

A great example of why this is really helpful is our free bootstrap theme available for download here:  http://goradiantweb.com/blog/post/free-bootstrap-3-october-cms-theme/

We wanted to garner tweets about October CMS as well as our own products.  As part of that, I whipped up a quick "tweetdownload" component wherein I could attach a tweet message, hashtags, and then a download file one a tweet has been posted. (thank you all yee nitpickers - yes, I'm aware that particular way of doing is pretty easy to hack....sigh....)

So I get our theme ready, our zip file, and then some images, as well as my tweetdownload plugin and then it dawns on me I have no easy way to simply add a small component or partial into a blog post.

The Solution

So ProBlog for October CMS, being our own product and all, got a new twig function for parsing the content to listen for partials in some nice clean format from within a post.

[[partial::partialname]]

With this we can go and quickly create a partial with our component twig like so:

{% component 'tweetdownload' twitterName='radiantweb' tweetMessage='Free #octoberCMS #theme! - #bootstrap 3 #responsive' fileName='Travu Bootstrap Theme' downloadFile='<a href="<a href=" http:="" goradiantweb.com="" themes="" radiantweb="" assets="" travu.zip'"="">http://goradiantweb.com/themes/radiantweb/assets/t...</a>">http://goradiantweb.com/themes/radiantweb/assets/t... %}<br>

So we now have a partial with our tweetdownload component spelled out. We also want to make sure we've added our tweetdownload component to our /blog/post.htm page. In this way the partial on the page can access for rendering.

Some Caveats

At this time, no matter where your partial insert is in your ProBlog post, it will be appended to the end of the article.

(EIDIT: v1.0.6+ the partial tag can be placed anywhere in the post )

I'm certainly open to suggestions as to how we can parse the content obstart/obend a twig/cms render, and then send back to the twig content render.  Please let me know if you see a way to achieve this.

For now though, this served perfectly well for what I wanted to achieve in my blog posts...so make sure you go grab that theme and give us tweet!

Tags: components, partials, twig

blog comments powered by Disqus