Responsive Snippet (beta)Download the Responsive snippet
The Responsive snippet is a complementary snippet for use with seyDesign Ultimate themes to add mobile ready, responsive capabilities when your page requires it. Simply add the snippet and its supporting files to your RapidWeaver project, no theme update required.
This code snippet is provided for legacy seyDesign / Nimblehost RapidWeaver themes.
Important NoticeKeep in mind that we as theme developers can only do so much to make your pages responsive. It's up to you to make content that responds well to scaling. There have been stacks released recently that can aid you with this. Have a look at what some developers have to offer on the Realmac Addons site.
This snippet is in beta. The basic features of our Ultimate themes work well on many smaller screens but only public testing will account for a greater variety of screen sizes and layout.
While the content of the actual snippet will not change, the source files they draw on might as we strive to improve the mobile experience that can be had by each theme.
InstallationTo install the Responsive snippet, double click the downloaded .rwsnippet file or drag and drop it onto the RapidWeaver app icon in your dock.
UsageYou must be using one of our Ultimate themes in your RapidWeaver project.
- Open the Page Inspector (RapidWeaver > View > Show Page Inspector).
- In the Page Inspector, navigate to the Header tab.
- Click on the Header field at the bottom of the Page Inspector panel.
- Find the Responsive snippet in your snippet panel.
- Copy and paste the Responsive snippet into the header field:
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, width=device-width">
<link rel="stylesheet" type="text/css" media="screen" href="../../resources/m.common.css" />
The final step is to add the m.common.css and lines.png files to the Resources section of RapidWeaver. These files load some extra CSS code and the 'hamburger' button, for the mobile toggle menu. That's it! Now when you view your site on a mobile device your page should adjust accordingly.