title

Article layouts

The article layout determines how an article will apear in the public view part of the Tiny Marbles CMS. The layout follows the chosen scheme and the related CI (colors, graphics ..) for the complete website. Each layout is connected to an article category. What you usually do: you create an article category (see next chapter), there you specify the layout. Then you create an article which you assign to an article category. This is the common way how an article gets the layout and therefore the appearance in the public view part.

adminguide_overview_2.png

Right now Tiny Marbles CMS provides the following layouts:

  • Appointment
  • Article list, news
  • Article list, short
  • Article long
  • Article short
  • Blog
  • Contact
  • Dictionary
  • Google Maps
  • Team

title

Layout types

Here you see the list of all available layouts, in each case with an example of existing websites based on Tiny Marbles CMS. Click on the thumbnails of the small screenshots to get an impression how the layouts are working. Attention: the colors, pictures, graphics and logos are of course not included in Tiny Marbles CMS.

Article short
article_layout_ex7.png This layout is the default layout and the most basic one. It only can be connected to the article type 'Article, short'. Therefore you only have one HTML-editor box. When the user clicks on the article category in the navigation tree of the public website, the article is shown with the title and the content of the HTML-editor box.

 

 

Article long
article_layout_ex2.png The layout 'Article long' can only be assigned to the article type 'Article, long'. Therefore you have two HTML-editor box. When the user clicks on the article category in the navigation tree of the public website, the article is shown with the title and the content of both HTML-editor boxes underneath. Currently this type of layout is used in the website scheme 'Financial' to provide a different color for the teaser of the article and the main content of the article.

 

Article list, short
article_layout_ex9.png Basically this layout provides a list of articles with the type 'Article, short'. When clicking on this article category in the navigation tree of the public website, the related articles are shown in a list with a separator and pagination at the bottom of the list. The articles are ordered by publish date.

 

 

Article list, news
article_layout_ex1.png This layout works similar to the layout 'Article list, short', but provides a list of articles with the type 'Article, long'. When clicking on this article category in the navigation tree of the public website, the teaser (first HTML-editor box) of the related articles are shown in a list with a date, a separator and pagination at the bottom of the list. In case the second HTML-editor box has content a link in the list with 'more' appears. By clicking on the link 'more' the user can see the complete article consisting of title, first HTML-editor box, second HTML-editor box. The articles are ordered by publish date and RSS can be used. 

 

Blog layout
blog.png The layout 'Blog' works like 'Article list, long', and provides additionally the features: comments, RSS feed, social network buttons and Permalink. The administrator can choose per article layout whether the comments or social network buttons should be shown and if the comment feature should be used with reCaptcha. Furthermore it is possible to add a notification send to the article author in case a new comment is posted. The comments can be closed for each article. 

 

 

Contact
article_layout_ex8.png The layout 'Contact' is a combination of the layout 'Article short' and additional input fields like 'name', 'email' and a message box to send a message to the website administrator.

 

 

 

Appointment
article_layout_ex4.png The layout 'Appointment' is a combination of the layout 'Article short', the layout 'Contact', additional input fields like 'appointment' and the possibility to send a message with attachments (using a file upload)  to the website administrator.

 

 

Dictionary
article_layout_ex3.png This layout provides a list of articles with the type 'Article, short'. The articles are ordered alphabetically and they are sorted in groups like 'A - F', 'G - K' and so on.

 

 

 

Google Maps
article_layout_ex5.png The layout 'Google Maps' is based on the article type 'Article, long'. A Google Map is shown, which can be specified on the administration page for the complete website. Additionally a text can be written in both HTML-editor boxes of article type 'Article, long'. The on the public view part of the website map appears in the middle of the content of both HTML-editor boxes. 

 

 

Team
article_layout_ex6.png The layout uses the article type 'Article, short'. Additionally a list of images are automatically shown which are tagged as 'team' in the image library. Additionally the description of each image is shown underneath the image itself. This layout type works perfectly well to set up easily a page where you would like to present your team.