WordPress.org

Ready to get started?Download WordPress

Forums

Rotating Tweets (Twitter widget and shortcode)
[resolved] [Plugin: Rotating Tweets widget and shortcode] Tweets bleeding off Safari/Firefox and iPad (12 posts)

  1. paulhorne
    Member
    Posted 2 years ago #

    I have a Rotating Tweets widget in the header widget area for my Genesis Theme at http://www.justiceandponder.com.

    The tweets are bleeding off to the right on some people's desktop browsers (Firefox and Safari), and also messed up when viewed on an iPad.

    Any suggestions?

    http://wordpress.org/extend/plugins/rotatingtweets/

  2. Martin Tod
    Member
    Plugin Author

    Posted 2 years ago #

    I can't currently replicate it (although I've had a look in Firefox and Safari on PC): perhaps it's finally time to buy that iPad!

    Currently, Rotating Tweets takes all the styling from the main theme apart from some font sizes and line-spacing - so that would be my starting point, but here are some other ideas that might work.

    1. You could further shorten any URLs (if they're what's causing the problem). Change line 307 of rotatingtweets.php to read:

      $after[] = "<a href='".$url->url."'>".$url->url."</a>";

    2. There's an option in jQuery Cycle not to resize the 'container' to the largest 'slide' (which might be what's causing the problem) - so you could add

      containerResize: 0,

      as an extra line around line 10 of /js/rotating_tweets.js - and see what happens! I've not tried this, so it might not have the desired effect!

    3. Otherwise, I can only suggest adding some more styling in style.css to #header .widget-area or, if the problem is unique to Rotating Tweets and you can't replicate it in, say, a text widget, to #header .widget-area .rotatingtweet whether by:
      • knocking back font sizes and/or
      • setting further limits to the size of the box and/or
      • adding overflow: hidden.

    Hope this helps. Please let me know if any of these work and, if they're not pure styling changes, I'll see if I can find a way to programme them in as options.

  3. Martin Tod
    Member
    Plugin Author

    Posted 2 years ago #

    I've now seen it doing it in Chrome - but, bizarrely, not in Mozilla.

    As a first step, I would suggest you try the following lines in your style sheet:

    .rotatingtweet, .rotatingtweets, p.rtw_meta {
    	width: 510px;
    }

    Another (more extreme) option to look at might be to add:

    #header .widget-area {
    	display:table;
    }
  4. Martin Tod
    Member
    Plugin Author

    Posted 2 years ago #

    Just taken a peek at http://www.justiceandponder.com/ via http://ipadpeek.com/ and it seems to be OK.

    I would be interested in knowing the solution you used to see if it's something I need to build into the plugin.

  5. karenelated
    Member
    Posted 1 year ago #

    Hi Martin

    Thanks for a great widget, which worked perfectly until yesterday. Now the text is bleeding over the right hand side of the column. I tried adding your first option, which just made the height shorter (weird). The next suggested fix did absolutely nothing.

    Any other ideas please?
    http://www.elated.co.za

    Thanks!
    Karen

  6. karenelated
    Member
    Posted 1 year ago #

    Now, despite undoing any changes made, the widget is shorter and only 2/3 lines high.

  7. Martin Tod
    Member
    Plugin Author

    Posted 1 year ago #

    I think it's a problem in the text widget immediately before it. The link isn't closed properly with <a/> instead of </a>. It turns the first tweet into a single, very wide, link, which breaks the width calculation of the widget.

    If you change that, does it solve the problem?

    Martin

  8. karenelated
    Member
    Posted 1 year ago #

    Hi Martin
    Thanks, that's embarrasing. But, no it didn't make a difference. In the plugin editor the rotatingtweets/css/style.css is inactive - does that make a difference?

  9. Martin Tod
    Member
    Plugin Author

    Posted 1 year ago #

    It's because a link is too long...

    http://simplevegancooking.wordpress.com/2012/10/06/creamy-cheezy-leek-and-spinach-pasta-sauce/ has already been cut down to simplevegancooking.wordpress. but needs to be cut down more.

    If you find line 436 in rotating tweets:

    if(strlen($displayurl)>29) $displayurl = substr($displayurl,0,29)."…";

    and change it to:

    if(strlen($displayurl)>24) $displayurl = substr($displayurl,0,24)."…";

    That should solve your problem.

    Alternatively, change:

    $after[] = "<a href='".$url->url."' title='".$url->expanded_url."'>".esc_html($displayurl)."</a>";

    to:

    $after[] = "<a href='".$url->url."' title='".$url->expanded_url."'>".esc_html($url->url)."</a>";

    and that should also solve your problem!

  10. karenelated
    Member
    Posted 1 year ago #

    Yes success! I changed it to 0,24. Thanks so much Martin!

  11. Martin Tod
    Member
    Plugin Author

    Posted 1 year ago #

    Just for the record, the very latest version of the plug-in now limits the Rotating Tweets widget to the width of the 'widget container' it is held in, provided the widget 'container' has the style 'widget' or 'widget_rotatingtweets_widget'. Hopefully, this provides a permanent fix to the problem.

  12. karenelated
    Member
    Posted 1 year ago #

    Yes Martin it does. Thank you!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.