Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I am currently using jquery.expander.js to hide/show paragraph content. I want to only use this for screen sizes less than 500px width and less (for mobile phones) ONLY. I am working in wordpress 3.5 and genesis theme 1.9.1

My questions:

  • Is there a good script proven and tested to load jquery.expander.js only on screen sizes 500px width and less. *The most important part is for desktop viewers if they reduce the screen size to 500px or less width it loads the jquery.expander.js and if they expand larger than 500px width it stops/kills the jquery.expander.js, again the reason being I just want to activate hide/show on a mobile device or desktop view that is 500px or less width.

  • The Wordpress question is: When one of our marketers adds content to a page they will do this in the entry content window for that page, how can I edit my php so that it will somehow place a div of around the entry content. Sample code below for div and class name it needs for the script to work.

    <div class="expander">

    <h1>Welcome and Thanks</h1>

    <p>Aliquam aliquet, est a ullamcorper condimentum, tellus nulla fringilla elit, a iaculis nulla turpis sed wisi. Fusce volutpat. Etiam sodales ante id nunc. Proin ornare dignissim lacus. Nunc porttitor nunc a sem. Sed sollicitudin velit eu magna. Aliquam erat volutpat. Vivamus ornare est non wisi. Proin vel quam. Vivamus egestas. Nunc tempor diam vehicula mauris. Nullam sapien eros, facilisis vel, eleifend non, auctor dapibus, pede.</p>

    </div>

*If I have not followed the forum rules let me know and I will adjust

share|improve this question
    
Please show us what you've tried so far and how your template code looks. –  kaiser Jan 23 '13 at 18:29
add comment

1 Answer

For the WordPress question, I'd create a shortcode. Something like:

function expander_wpse_82811($atts,$content) {
  return '<div class="expander">'.$content.'</div>';
}
add_shortcode('expander_wpse_82811','expand');

Which your editors would use like:

[expand]Aliquam aliquet, est a ullamcorper condimentum... [/expand]

http://codex.wordpress.org/Function_Reference/add_shortcode

share|improve this answer
    
Thanks for this, I was hoping to not have them code anything in the entry content window, is this more of a hope than a possibility? –  devon Jan 23 '13 at 17:04
    
You can add buttons to the editor and should be able to insert the shortcode the same way that things like links and lists are inserted, but I don't have time to work that up. There are questions/answers on this site that will tell you how to do that though. –  s_ha_dum Jan 23 '13 at 17:06
    
Thanks for this, I will be testing/implementing in a few weeks I will post any questions and the results. –  devon Jan 23 '13 at 17:54
    
So far I have done my research and wanted to reach out to the forums for suggestions, when I work on the code I will share every detail, thanks all and if anyone has other ideas let me know and I will test that as well. –  devon Jan 24 '13 at 18:23
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.