Hot Responsive WordPress theme looks simple, but under the cover, there’s a complex code that makes such unusual way of showing the posts possible. First of all, jQuery mobile handles the top menu and all interactive elements, such as buttons, selection boxes, as well as the transition effects between the pages (if enabled). The Masonry is a jQuery plugin which is used for to line up the posts like bricks in the wall. This plugin dynamically determines the available space in the user’s screen, and then calculates the widths of the posts in order to maintain the proportions of the bricks and overall look of the wall. Masonry can line up the bricks in many columns in order to display more information for users with larger screens. However, it can also show only one column of the blocks (posts) for users who are visiting your site using the smaller screens, such as smartphones or tablets.
It’s worth mentioning that the same system of “the wall bricks” is used throughout your site. Not only for the front page. All categories, tag listing pages, author pages and search results pages are displayed in the same format. Therefore, the uniformity of your site and overall responsivity is guaranteed if you are using Responsive WordPress theme.
Infinite Scroll jQuery plugin has been used to replace default WordPress’ Older Posts and Newer Posts links. With infinite scroll, the first set of your posts/blocks (which number is set as usually in WordPress Configuration – Reading) will be shown first. When visitor scrolls the page down, as soon as s/he reaches the end, the new set of posts/blocks will be loaded. So, there’s no need to click anywhere. Reading the information from the “wall” is fluid and uninterrupted.
Responsive WordPress theme uses a handy feature of WordPress: Custom fields. They are used when some bricks should be colored differently. You probably noticed that some blocks on our demo are colored differently. For this purpose, a custom field named as ‘color’ should have appropriate value set, in example ‘green’. Also, if some posts contains text only, their width can be set by making a custom field named as ‘width’ with value inside. In example, ‘dynlayout_wide2’ (the number can be from 1 to 5). You can use a higher number to make wider blocks.
Hot Responsive has many parameters in the theme options page that allows you to configure all features mentioned above. You can control the minimum screen size when the left and the right widget positions will be displayed in different columns or in the same column. You can also set from what screen size they will be moved to the footer area to make more space for the posts. The width of the normally sized posts/blocks in the wall is another parameter that you would find useful. What value you would set there depends of your content. If you want to show more posts with less content, you will keep the value low (as on our demo). But, you can also decide to have less posts with more content (text) in each post. In this case, you would simply need to increase ‘Box Width Unit’ parameter.
Our Responsive WordPress theme is not just responsive, but also very configurable. It can be used as a starting point for development of simple or complex responsive sites, based on WordPress.
Features of the Responsive WordPress theme
This is a responsive WordPress theme. This means it will look good and optimized on all desktop and notebook computers, as well as mobile devices (tablets and smartphones)!
Well parametrized theme
All parameters available in this theme are located in a dedicated page of your WordPress Dashboard. You can access it from Appearance > Theme Options. Each theme has different set of options related to font and background colors, widths of the elements and features that can be enabled or disabled. From the Theme Options panel you can select active color style of the theme or create your own color combination.