DRY templates with jekyll - jekyll

I have a product grid in my Jekyll site. I'd like the product grid to appear with different products in different places on my site, but I want to only store the HTML for the grid in one place.
I've looked into collections (and I'm using collections for something else in my project), but collections don't seem to be the right tool. The product grids aren't really semantically a "group" of anything.
Is there any other way I can avoid copying the product grid HTML into multiple places?
Note: I'm new to Jekyll.

You should use an 'include' for this. This is the easiest way. I think that using a 'layout' with a 'collection' would be a more beautiful solution.
{% include productgrid.html %}
Note that you should put the 'productgrid.html' file in an '_includes' directory.
More info can be found here: http://jekyllrb.com/docs/includes/
or in this walkthrough: http://jekyllcodex.org/getting-started/

Related

Has anyone tried to use jekyll to generate dashboard pages?

I'm using static html pages and incline js to generate dashboard. The backend is go.
However, as number of pages growing, I have to maintain a lot of html pages, and many of the block elements are duplicated.
I'm wondering whether there're some cases to use jekyll to generate dashboard pages, since jekyll can convert pieces of elements into complete htmls? So that I can modify one part and the modification take effect on every html pages that generated.
Are there better framework to do so?
Thank you!
If you're duplicating elements, then those are the perfect pieces of markup to put into a layout and/or include. That's exactly what those are for.
Each individual page you need can reference a specific layout in its front matter. Includes can be used within the individual pages or within the layouts or both (and can be nested).
The Jekyll Documentation is ok for this, but to wrap your head around it I find it easiest to look at the documentation together with a few existing Jekyll templates to understand how it all fits together.
after a bit more dig. I found that packages such as Grunt and Gulp can be used to generate htmls from separate parts.

Editing static content

I'm generally really impressed with Bolt and the flexibility it provides me for creating contenttypes with specific fields with minutes. However, I have a template which has common content across the site that I would like to make editable without allowing the user to edit the .twig files directly.
I've considered creating a different contenttype just for each part of the template but this seems inefficient.
For example I would like to make the address editable, and a panel that contains text and three images. Just wondering if there's a sensible way for achieving this.
Thanks
Create resource ContentTypes for this type of stuff, then you can put that into inheritable Twig files that you can then {% include '' %} as required.

include common html in various places of a template using django

I have several html templates that extend a base template using django. In these templates there are common html/django snippets that I would like to have in one place and then rendered in the various places they appear in the templates.
i have looked at include tags, but I'm not sure this is what I need.
Any suggestions or explanations appreciated
Thanks
Include is the way... you can keep your snippets in a template subdirectory (like templates/includes/....) for example and do {% include "includes/mytemplate.html %}.

What is the best way to organize Jinja2 templates?

I found the way Jinja2 extends works quite inadequate or I'm possibly not using it in the correct way.
I would like to break down my templates folder into smaller, manageable pieces and include them into a bigger page. For example, I would like the index.html page to be made up of:
header.html
content.html
signup.html
footer.html
While my dashboard.html would be:
header.html
dashboard.html
footer.html
I can create a base.html template and include header/footer etc. in it but, that still leaves me with a rather large chunk of html that I don't want. I want as small pieces of html in one file as possible.
Please suggest a way to achieve this. Or guide me to some best practices, etc.
I created a jinja CMS to generate child templates like your index.html and dashboard.html. A child templates holds one or more small html blocks. This html is stored in the db. I use App Engine.
The first version of this CMS can be found here:
https://codereview.stackexchange.com/questions/5965/review-request-jinja-cms-for-energiekantoor-nl-on-google-app-engine

how to convert html template to joomla template?

I have a html template that has multiple pages like home, about us,contact,services,... and I want to convert it to a joomla template.I spent a lot of time for searching a good tutorial in google like this:
http://www.learning.asarayan.com/education-website-design/joomla-training2/334-convert-html-to-joomla-template
but non of them can answer my question: how can I convert ALL pages of html to joomla??I mean that I can convert one page for example home to joomla and define its position but what about other pages?
can anybody introduce me a COMPLETE tutorial???
sorry for my poor english
thanQ
You may start with tutorial posted at below address
http://www.tobacamp.com/tutorial/5-easy-steps-converting-html-template-to-joomla-template/
There is no automatic converter or out of the box solution for this, neither any tutorial to help you.
The best way to sort out the issue is by duplicating the template with the help of Artisteer. You can just recreate the template design and feel with Artisteer. Download link: www.artisteer.com/?p=downloads
You need to change your mindset from that for a static template to that for a dynamic template.
In joomla templates there is a base layout called index.php as you know. But that is very skeletal usually, is just defines some locations on a page, includes your css and javascript that is common to all of your pages. This gives your site a common look and feel and ensures a good user experience.
For your css for the individual pages you would normally just include that in the template.css file or similar.
Within the index file you will see places that say jdoc:inlcude. These are the places that actually include the layouts that provide detailed html for specific blocks on the page, typically there will be one component jdoc (there cannot be more than one) and many modules and module ones as well as some others.
The html for these documents is found in the components/com_componentname/view/viewname/tmpl folders.
To override the core layouts you use the template override system by placing same named files in the html folder of your template. You can look at the included templates to see how this works. There is pretty good documentation of this on the joomla documentation site.
http://docs.joomla.org/How_to_override_the_output_from_the_Joomla!_core will get you started.
Also this may be a point of confusion. In a CMS you strive to separate content from presentation. So if you enter the core information in the cms, i.e enter the contact information in com_contact, and enter most of your current content into individual articles you will start to see how it actually works. I would usually recommend first entering all of your static content into the appropriate places, then work on making the rendered pages look exactly the way you want them to.