Home   →   Blog   →   Blog Template Inspired by Sci-Fi Magazines

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.

blog_2x_1x.png

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.

If you want to know all the details about our template, feel free to visit this page.

Next Posts
548aae1da0771fd2b1a24bf73a958f5174e85c8f iOS 11. New Powerful Features
Apple has released a new version of its iOS, macOS, watchOS, and tvOS software on the 6th of June. Let's take a close look at what new we can find here, and what updates IOS developers and owners of existing applications should take into account.
3ed7854d756491560812718dea47bdc71d5b4e86 The Behance Featured Cinema App and Music Player by Agilie
Agilie is pleased to announce that our two design projects Cinema App and Music Player are currently being featured in the UI/UX category on Behance.
00a86dd3b1994896d440bf67332d3e947f265f08 Animated Toggle Menu
We bring to your attention our new concept of a free animated toggle menu that can be helpful to web developers for creating websites
Notice Our website uses cookies, which are necessary for its functioning and required to achieve the purposes illustrated in the privacy policy. By closing this banner you agree to the use of cookies.