SO Responsive Content

Screenshots

For sites that have been built Responsive, this plugin will enable you to adjust your content too. On mobile devices like smart phones people are less likely to read very long pages of content and with the Responsive Content plugin you can easily adjust the text showing on these different devices. The SO Responsive Content plugin adds a Formats drop down menu (pre WP 3.9 the menu is called “Styles”) to the first line of the TinyMCE Editor. Once you have selected a visibility class, the plugin shows that in 3 locations: as selected in the drop down menu with a “button” in front of the selector (the only function of this “button” is to show you that the element behind it has one of the visibility classes) in the path There are 15 visibility classes in the Styles menu on the Visual Editor: 6 for paragraphs (3 to show and 3 to hide) 3 for links (only to show as hiding can be done with the inline classes below) 6 for spans (3 to show and 3 to hide) Since version 0.3 I have added 6 buttons to the Text Editor as well. For flexibility purposes these buttons (3 for showing and 3 for hiding) only add a class, so you can add the element yourself. The plugin already comes with all the styles necessary to show the elements on or hide them from the front end, so all you need to do is save your Post, Page or other Post Type and visit your site from a few different devices (or resize your browser) to see your content change depending on the width of the browser! Under the Other Notes-tab I have added some information on Usage and Languages. Usage You can use the SO Responsive Content plugin basically for any Post Type. Although possible, I strongly discourage using the classes with images. The reason is that the SO Responsive Content plugin only uses media queries with display: block;, display: inline-block; and display: none;. If you were to add a large image to only show on large screens, a medium image to show on tablets and a small image to show on smart phones, then the person visiting your site using a phone has to download all 3 images, which can have a major impact on the data plan of the visitor! To conditionally show images it is much, much better to implement the MobileDetect script on your site. Languages Naturally the SO Responsive Content plugin has been fully internationalized. In the languages directory you will find the .pot file and the .po file. I already have added the Dutch translation files. The plugin only contains 38 strings (of which many only 1 word); it would be a awesome if you can help me translate it into other languages! Dutch translation (nl_NL) by Piet Bos (last updated April 10, 2014 – 2014.4.10) Serbian translation (sr_RS) by Borisa Djuraskovic (last updated April 10, 2014 – 2014.4.10)