How to use article templates

OK, the first thing you should probably know is that Article Templates apply to  Posts and Pages.

Secondly, the Template selected on Default Templates for Article Template will automatically become the default Template for pages if they are marked as default.

*Please note that if you wish to override the look of individual posts/pages when viewed in an article format (after you open it), you must opt to select a custom template in the metabox inside each post.

So, let’s begin!

After following the instructions in How to Use Templates and How to Use List Templates, you will find yourself in the Templates Setup section of your MoviPress dashboard.  Next to the List Templates tab you will see another tab named Article Templates – please go ahead and click on this tab.

  • Namein the text box input a name for your Article Template (as before, any name that doesn’t include default!).
  • Show Statusbarcheck the box if you would like the statusbar to be displayed when the app is open and in use. If you don’t want to display the statusbar, leave the box unchecked.
  • Border – increase/decrease the border size of the articles. Play about with the size until you are happy with the result, you can preview any changes instantly on the model screen.
  • Background time to choose your background colour for your articles! Click on the small colour square and either choose from the given colour gradient or input the hex code in the textbox next to the top colour square. You can use a colour tool to help you out.
  • Show – check the box if you would like to display the app toolbar in an open article.       Once the box has been checked, further customization options will appear. If you don’t want to display the toolbar, simply leave the box unchecked and move on to the next subsection.
  • Title Type – leave Content Title selected if you want to display in the app toolbar the titles of the content published. Select Custom Title from the dropdown list to display your own personalized title – this title must then be input in the given textbox.
  • Font Family – time to choose a font! Use (https://fonts.google.com/) for guidance.  Once you’ve chosen your font, delete the name of any existing font shown and either search for the new font alphabetically in the given dropdown list or start typing its name.  And don’t forget to click on the name and select the font!.
  • Text Align – choose from the dropdown list if you would like to align your text to the left, center or right.
  • Text Size – ranging from 8 to 24, select which size you would like your title text to be. This can also be previewed instantly.
  • Background – time to choose the background colour of your toolbar and, just as before, choose your colour by clicking on the colour square and selecting from the gradient or inputting the hex code.  Instantly preview your changes on the model display.
  • Icons/Text Colour – here you can select what colour you wish to display the toolbar title text and icons in. Click on the colour square and pick a colour!  And, as above, the changes can be previewed instantly. You can use a colour tool to help you out.
  • Show – if you wish to display the titles of the articles, check the box and this will display the customization options. If not, leave it unchecked and skip to the next subsection.
  • Font Family; Text Align; Text Size; Text Colour – following the same instructions as in Toolbar, customize the look and size of the article titles.
  • Show – check box if you would like to display a few lines taken from the article. If you don’t want to display this, leave the box unchecked and move on to the next subsection!.
  • Font Family; Text Align; Text Size; Text­ Colour – once again, if the box has been checked, choose how you would like to customize the excerpt text.
  • Show Author – check box to display the name of the author on each article, or leave unchecked to not display the name.
  • Show Date – check box to display the date on which the article was published, or leave unchecked to not display the date.

(If both boxes are left unchecked, no editing options will be made available and you can move on to the last subsection.  At least one box must be checked for any customization tools to be displayed – both Author and Date, if opted to be shown, will be uniform in the style you create.).

  • Font Family; Text Align; Text Size; Text Colour – as above, follow past text editing instructions to customize how the name of the author and the date published will look and preview your changes in the model screen.
  • Show – check box to display a few lines of each article or leave unchecked to not display any content. As above, if the box if checked, further customization tools will become available to you.
  • Font Family; Text Align; Text Size; Text Colour – repeat the text editing instructions…surely you can do this in your sleep by now!.
  • Header – (optional) this textarea allows you to add some customizad styles to your content. E.g if you want to show the links of your content with a different colour you can insert:

<style>
a {
color: green;
}</style>

  • Show – check box to display the option for readers to comment on the article. When checked, you can start customizing – if the box is left unchecked, readers will not be able to leave a comment but you can move on to the next subsection…!.
  • Comments Text – input the text you would like to display in the comments button. It may be wise to write something short and to the point, so that readers that they must click on this button to leave a comment.
  • To Comment Text – ???
  • Font Family; Text Align; Text Size; Text Colour – repeat the text editing instructions you are now so familiar with to customize the text you have written.
  • Button Colour – choose the colour you would like the comments button to be using the same instructions as for the text colour. Make it stand out by using a contrasting colour to your background – or go to material.io for helpful hints and suggestions for colour combinations.

Note: The colours, font family, font size, alignment etc, will be the same as the article design.

  • Show – check box to display the categories which the article falls into. These will be displayed at the very end of the article. Once again, leave the box unchecked if you don’t want to display any categories and skip to the next subsection. By checking the box further customization options will be unveiled!.
  • Include Tags – check box if you wish to display any tags from the article alongside the categories. Once the box has been checked, the Tags subsection below will automatically disappear and the both Categories and Tags will be customized simultaneously. Leave the box unchecked and the tags will not be included alongside the categories, and you will still have the option to display and customize this subsection.
  • Title – If you would like users to know exactly what you are displaying here, choose a title and input this in the text box. If you think it’s pretty self-explanatory, leave it blank and carry on customizing!.
  • Separator – choose a character/symbol/word/number etc which will sit between each category/tag to separate them from one another. Input this into the text box, or leave blank if you don’t want a separator.

Helpful Tips: make sure to put a space before and after your chosen separator, if not everything will bunch up together and the separators won’t do much separating! Try adding a couple of spaces at the end of your chosen title (if you have one) as this will help to define it as a title and not another category/tag.

  • Ending Chars – just as above, choose a character/symbol…etc which will appear at the end of the list of categories/tags. Input this in the text box or leave blank if you don’t want any ending characters.
  • Style – choose how you would like to display the categories/tags from either In Line or Tag Cloud from the dropdown list. In Line will display the categories/tags in a straightforward, sentence-like fashion, whereas Tag Cloud will display them randomly in the shape of a cloud (kind of like a brainstorm diagram, just without the arrows!).
  • Font Family; Text Align; Text Size; Text Colour – customize the text…you know the drill by now!.
  • Random Colours – check the box if you would like to display the categories/tags in random colours, overriding your chosen text colour (if you have input a title, though, this will be shown in your chosen colour, as will any separators/ending characters).
  • Links Colour – if there are any links amongst the categories/tags, choose a colour to display them in so as to easily differentiate them from the rest of the list.
  • Show – check box if you wish to display any tags from the article, further customization options will therefore be made available. Leave unchecked if you don’t want to display any tags and move on to the next subsection.

Title; Separator; Ending chars; Style; Font Family; Text Align; Text Size; Text Colour; Random Colours; Links Colour – follow aforementioned instructions!.

  • Show – check box if you would like for the author’s details to be displayed below the article. These details will be the name of the author followed by a short biography or whatever the author has chosen to share about themselves (this information is usually written by the author). Further customization options will be made available. Leave the box unchecked if you do not wish to display this and move on to the last subsection…almost at the finish line!.
  • Font Family; Text Align; Text Size; Text Colour – follow the same instructions you have been following for text customization!.
  • Background – choose a background colour from the colour gradient or input the hex code. Go to material.io for colour pairing tips.

Save Changes – After all that hard work, DON’T FORGET TO SAVE CHANGES!!  If this small, innocuous blue button is not clicked on…

ANYTHING NOT PREVIOUSLY SAVED WILL BE LOST.

So there you have it, you have created your very own, fully customized and personalized Article Template!,