Blog Template Inspired by Sci-Fi Magazines
Our Agilie web team has recently developed a new free HTML template that can be used as a spectacular blog concept. When creating this template, we were inspired by the stylish science fiction magazines of the 80s-90s. We hope, you’ll find our shot not only interesting but also useful.
So, we’re happy to present you Science Fiction Magazines Blog template. Read all the details in our article.
How to use?
As we’ve already mentioned, Science Fiction Magazines Blog template can be safely used to create a blog on any platform (CMS, framework, etc.). This is a standard and convenient template that will help you get beautifully designed blog pages able to attract users' notice to the site.
Structure of the blog template
Science Fiction Magazines Blog template consists of 3 logical elements: header, content section, footer.
The header contains the main navigation elements used as paging. And no matter how this template is created (through CMS or the web framework), you can easily customize the navigation to the previous and next articles by using the following blocks:
<nav class="navigation-block left"> - the previous page
<nav class="navigation-block right”> - the next page
There is also the main menu in the header, where you can place any links to external resources, or create additional pages on the example of the basic blog page.
The content section should contain an image; it's specified by the template. And whatever image you upload, the maximum allowed size for the template is 700px high and 510px wide. Article-image-preview is the class used to wrap the image
The content section also uses the slides-counter block that provides a user with information about the number of articles and identifies the current page number. It could be applicable if you want to use the carousel in Science Fiction Magazines Blog template.
The footer contains navigation unit and allows you to return to the last article.
In contrast to the slides-counter block, the slider-indicators block located at the bottom of the page gives a visual representation of which page you are on. To identify the active page, use the class "active" for the TD tag.
In order to customize the template, we recommend using the "site.js" file for scripts and "style.css" - for the stylesheet.
