Documentation for Joomlashack Extensions
A new breed of Article Layouts
The first thing to know about Shack Article Layouts is its purpose.
Shack Article Layouts is a sort of page builder, utilising the Joomla! core. It is a module that displays articles. This is an important aspect for a couple of reasons.
First off, we at Joomlashack like the design principle of separating presentation and content. A lot of available page builders mix these parts to achieve flexibility when setting up layout designs.
The downside is that it becomes harder for the content writers to administrate the content without disrupting the layout. By having the content in Joomla articles, content writers will have a single, familiar place to work in.
Second, by using Joomla core as much as possible, the website becomes easier to manage and administrate. It is also easier to switch between ways of displaying content within Joomla if everything is located where intended, and any related functionality in Joomla can be utilised as well.
The basics: Selecting articles
There are two basic uses for Shack Article Layouts:
- Setting up single pages with a complex layout and specific content, perhaps a landing page of some sort.
- Creating lightweight structures for repeated pages with a complex layout or intricate relationships.
The former primarily utilises the more static ways in Shack Article Layouts to set up an article selection. For a set of specific articles, just simply select the corresponding article IDs.
For a set of articles from a specific group, use the tag or category settings. Watch this live on our Pixpro Labs Demo site.
The latter instead makes use of the dynamic ways in Shack Article Layouts to set up an article selection. This will utilise data available in the pages and menu items where the module is shown.
With this possibility, the number of modules needed for a repeated page layout is reduced from one set per individual page to one set per page layout, which can greatly reduce the structure needed for a large website. Watch this live on our Pixpro Labs Demo site.
The basics: Setting up a layout
As Shack Article Layouts is a module. Some of the possibilities for a layout come from the template used on the website. This includes module positions and rendering of the modules.
Find a template that is as flexible as possible, without having to be too complicated. A good basic set of module positions and full rendering of the modules within these is all that is needed.
Full rendering refers to things as rendering the module title, using the Advanced parameters for the module and such.
Independent of the type of page that is being created, the procedure is the same.
Divide the page into sub layouts by identifying similarly styled sections of content, and in the case of creating a lightweight structure for repeated pages, identifying the sections with dynamic content.
Depending of the content for the section, each sub layout can now be created with a Shack Article Layouts module. Since the module is able to display multiple articles, sections with multiple blocks of same styled content can be created from a single module and multiple articles.
An example of both these types of pages is our own Pixpro Labs extension pages. These are landing pages of sort, and they are also pages with a repeated layout - one page for each extension.
The image below illustrates a singular Shack Article Layouts module displaying 3 articles in a grid. This module can be used on all the pages by utilising the dynamic article selection in Shack Article Layouts.
The setup works by combining tags and categories, and having IDs for these set in the respective menu item. The best options for this is probably Category Blog and Tagged Items.
To create a clean page for us to build our layout on, we utilise the feature of hiding the system output for these pages. This feature comes with the excellent Yootheme template we use for our website.
The basics: Designing a layout
When the layouts are in place, they need some designing. This can be done in multiple steps, varying from super easy to a bit more difficult, depending on the coding skills available.
First off, the content that is to be displayed is chosen from within each Shack Article Layouts module by selecting the corresponding options on the Display Options tab.
This tab is made as comprehensive as possible, while still having a great user experience. The available options displayed are altered by each choice made, so that only the options that actually will have an effect are shown.
When all the content is in place, the sub layout is chosen by selecting a corresponding Alternative Layout under the Advanced tab. There are a couple of layout templates available already, except for the default one, that uses the UIkit framework included in templates from Yootheme.
It is also possible to create new alternative layouts by editing the default template. Basically, the only thing needed for this is to copy the default.php and default_items.php files, rename them and then edit the HTML in the default_items.php file. The file is very developer friendly with commented sections and clean code.
A more accessible way of making minor changes to the layout is to use the options available under the Advanced tab. Again, only options that will have an effect are shown.
The options available are selecting the tag for each element in the layout and adding CSS classes to them. This can greatly modify the way the finished result looks like, and will lessen the need for super specific Alternative Layouts. Watch this live on our Pixpro Labs Demo site.
Related Blog posts Introducing Shack Article Layouts Separate content and presentation Do more with core! Creating dynamic page layouts in Joomla! using Shack Article Layouts [Infographic]
To install Shack Article Layouts, please, download it first from your Joomlashack customer Dashboard.
To properly run Shack Article Layouts on your website, please, make sure your site meets the following technical requirements.
In order for this extension to work normally on your site, the extension must meet some technical requirements. Once you read the instructions below, you will be able to easily identify what those requirements are. You will also learn what to do if your site fails to meet one of them.
We strongly suggest using at least PHP 5.6. PHP itself doesn't support any versions lower than 5.6. Click here to see more details on currently supported PHP versions or see the "Supported Versions" diagram below.
Any version of PHP before 5.6 doesn’t have security updates and will not keep your site safe.
As you can see from the diagram, any release of PHP lower than 5.6 is marked as "End of life". According to the PHP website, a PHP release marked as "End of life" is:
A release that is no longer supported. Users of this release should upgrade as soon as possible, as they may be exposed to unpatched security vulnerabilities.
The official Joomla recommendation is PHP 5.6 or higher. Click here to see Joomla's recommendations.
- MySQL: version 5.5.3 or newer.
Web Server Requirement
- Apache: version 2.4 and newer.
- Nginx: version 1.8 and newer.
- Microsoft IIS: version 7 and newer.
Joomla Version Requirements
Joomlashack supports the latest version of Joomla 3. If you're unsure about the latest version of Joomla, click here to visit Joomla.org.
What Version of PHP, Database, and Joomla Do I Have?
If you are not sure what version of PHP or Joomla your site is currently running, here's how you can find it out:
In your Joomla site, go to System > System Information:
Both your Joomla and PHP versions will be visible on this page:
What Should I Do if My PHP Version is Below 5.6?
Copy-and-paste this text and send it to your hosting company:
I'm interested in running the Joomla web software and I was wondering if my account supports the following:
- PHP 5.6 or greater
- MySQL 5.5 or greater
- The mod_rewrite Apache module
- HTTPS support