Responsive design


Two modes to choose

mode select

WpBolt is, in order to provide a stable Responsive design, Bootstrap We have to base.

However, Bootstrap is also weakness that the size of it therefore CSS is a multi-function is large.

Thus, to permit select two modes for responsive.

  • WpBolt mode: yelling stop to the minimum necessary function, high-speed, lightweight mode
  • Bootstrap mode: Bootstrap mode that you can use the full functionality of the

※ The Bootstrap is

The most popular there is, NASA (National Aeronautics and Space Administration) and MSNBC (American news broadcaster) Web application build a collection of tools it has also been used in, such as in the GitHub.

item of Wikipedia “Boostrap” Than

In the “Bootstrap mode”, also, such as plug-in CSS classes and Javascript that are defined in the Bootstrap,
it can be used as it is.

  • For Bootstrap, Bootstrap Introduction of Tohoho For more information it has been described in the like.
  • In using the WpBolt, you do not need any knowledge of Bootstrap .

Fully responsive

By Bootstrap adoption, WpBolt does not perform, such as the distribution process by the type of device, it is a complete responsive environment.

Therefore, without being affected by the proxy cache and WordPress plug-in cache functions and the like, you can always show the appropriate size of the site to browse the user.

The appearance of WpBolt by screen size

In WpBolt, according to the specifications of the Bootstrap, the width of the container will vary as follows.

Screen size Container of width
Large display (more than 1200px) 1170px (1140px + both ends 15px padding)
Medium-sized display (992 ~ 1199px) 970px (940px + both ends 15px padding)
Tablet size (768 ~ 991px) 750px (746px + both ends 2px padding)
Smartphone size (less than 768px) Screen full width (both ends 2px padding)

In addition, in the WpBolt, you can choose the width of the sidebar from 336px and 300px.

Posted by admin