• Resolved saemosaemo

    (@saemosaemo)


    Hello Martin!

    I really love your plugin and appreciate all the resolved requests and the quick replies. I read through some of your support resolutions regarding this (for example: http://wordpress.org/support/topic/more-than-1-tweet?replies=8) but perhaps I missed something. I am trying to create this carousel look:

    http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/PhotoshopScreenSnapz004.jpg

    I have managed to have it show 4 up, horizontally, but I have two questions:

    1. This is the shortcode I am using. I turned off rotate because it loads from top to bottom, so I turned it off for debugging. Is there any way to have it ‘carousel/slide’ horizontally to the next tweet from right to left with arrows showing to cycle through them?

    [rotatingtweets screen_name=’dotcapital’ no_rotate=’1′ rotation_type = ‘carousel’ show_meta_reply_retweet_favorite = ‘1’ tweet_count=’4′]

    2. I ran into a stair-stepping problem when placing float:left on .rotatingtweet, see here on the dev site: http://phoogoodev.com/southpark/about/
    I tried to place a clear-fix in the parent div but could’t find the div in rotatingtweets.php.

    Any help or a point in the right direction would be appreciated. Thanks!

    https://wordpress.org/plugins/rotatingtweets/

Viewing 15 replies - 16 through 30 (of 57 total)
  • Thread Starter saemosaemo

    (@saemosaemo)

    Hi Todd!

    Having 4 slides at a time at tablet and desktop sizes is what I am looking for. But when seen on mobile device like an iphone, then collapse to 1 tweet.

    I see what you mean by div.responsive img { width: auto; height: auto }, but I am using a grid setup that is based on percentages for widths. If this will interfere perhaps we can write CSS that is needed.

    Thanks!

    Plugin Author Martin Tod

    (@mpntod)

    I’ve updated the development version to support the new options.

    I think you may need some serious CSS, but try:

    [rotatingtweets screen_name='dotcapital' rotation_type = 'carousel' show_meta_reply_retweet_favorite = '1' carousel_horizontal='1' show_meta_prev_next='1' np_pos='bottom' prev='<' next='>' tweet_count='10',carousel_count='4',carousel_responsive='1']

    Thread Starter saemosaemo

    (@saemosaemo)

    Wow! Its looking the best so far. Its showing 3 up but it might just be the CSS. Will take a look into it. Thanks!

    Plugin Author Martin Tod

    (@mpntod)

    Definitely looking better.

    Have you updated to the latest development version? I’m not seeing the code I was expecting to see in the HTML.

    Incidentally, to manage the next/prev buttons, be aware that you can use the ‘next’ and ‘prev’ flags to use images instead of text (e.g. ‘next=”<img src=’/nameofyourimage.png’ alt=’next’>”)’ and then CSS to position it using the .rotatingtweets_nextprev .rtw_next styles (although I think you’re already using the former).

    Plugin Author Martin Tod

    (@mpntod)

    I’ve had a look and it seems to be working!

    Thread Starter saemosaemo

    (@saemosaemo)

    Hi Martin,

    I am sorry I have not replied in a while, this project got put on hold until I finish another site. Anyways, It still does not work showing 4 at a time, then scrolling to the next tweet. it shows 3 at a time and in chrome the width change when it auto scrolls. I have updated to the version you sent me (in a link) about a week ago, is that the version you are referring to?

    Any thoughts? Thanks!

    Thread Starter saemosaemo

    (@saemosaemo)

    If it helps any I was able to accomplish what I am trying to do with the Flexslider 2.0.
    See the bottom of the page here:
    http://phoogoodev.com/southpark/uncategorized/test-post-6/

    I wasn’t quite sure how to pull the twitter API, which is how I found your plugin.

    Plugin Author Martin Tod

    (@mpntod)

    In your situation, I would clear all the first attempta at CSS from the RT tweets (which were originally trying to make an vertical carousel script work – and so are probably not suitable for the new script) and rebuild the CSS approach they have used to deliver the result you want in Flexslider.

    Martin

    Thread Starter saemosaemo

    (@saemosaemo)

    Hi Martin,

    I am finally back! I have cleared all CSS and started from scratch,but I wasn’t sure what you meant by “(which were originally trying to make an vertical carousel script work – and so are probably not suitable for the new script) and rebuild the CSS approach they have used to deliver the result you want in Flexslider.”

    Anyways, I am still sticking with your carousel but had a few questions.

    1. I tried replacing images for the next previous buttons but the image does not show. here is what I am using now.

    [rotatingtweets screen_name=’applespotlight’ official_format = ‘1’ rotation_type = ‘carousel’ show_meta_reply_retweet_favorite = ‘1’ carousel_horizontal=’1′ show_meta_prev_next=’1′ np_pos=’bottom’ prev='<img src=’http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_left.png’>&#8217; next='<img src=’http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_right.png’>&#8217; tweet_count=’10’ no-rotate=’1′ carousel_count=’4′ carousel_responsive=’1′]

    2. no-rotate=’1′ does not seem to be working. Is there a way to stop the auto-rotation otherwise?

    3. Not sure why the tweet ‘snippet’ CUTS off in the middle of a word in some tweets.

    4. Is there any way to style or edit the “layout” of the div.rotatingtweet ?
    I am trying to move the time stamp to the top right corner.

    The link is still the same:
    http://phoogoodev.com/southpark/about/

    Thanks for your time and patience on this!

    Noel

    Plugin Author Martin Tod

    (@mpntod)

    You can’t enclose ' inside another ' in a shortcode. Instead of prev='<img src='http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_left.png'>' you need something like prev='<img src="http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_left.png">'

    Does

    [rotatingtweets screen_name='applespotlight' official_format = '1' rotation_type = 'carousel' show_meta_reply_retweet_favorite = '1' carousel_horizontal='1' show_meta_prev_next='1' np_pos='bottom' prev='<img src="http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_left.png">' next='<img src="http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_right.png">' tweet_count='10' no-rotate='1' carousel_count='4' carousel_responsive='1']

    work better for you?

    That will also make no_rotate='1' and carousel_responsive='1' work properly.

    In terms of styling and layout, if you can’t get the result you want with CSS, the nuclear option (using the development version with a ‘custom’ format) is here.

    Thread Starter saemosaemo

    (@saemosaemo)

    Hmm, that did not work, I believe I did try different apostrophe combinations before. I even tried adding via php shortcode in the template file.

    As for the no rotate, that did not help/work either. I tried removing/disabling all next/prev options too.

    Any other suggestions? Thanks!

    Plugin Author Martin Tod

    (@mpntod)

    There’s too many spaces in the shortcode. Apologies. How about:

    [rotatingtweets screen_name='applespotlight' official_format='1' rotation_type='carousel' show_meta_reply_retweet_favorite='1' carousel_horizontal='1' show_meta_prev_next='1' np_pos='bottom' prev='<img src="http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_left.png">' next='<img src="http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_right.png">' tweet_count='10' no-rotate='1' carousel_count='4' carousel_responsive='1']

    Thread Starter saemosaemo

    (@saemosaemo)

    Hi Martin, Sorry for the delayed response. I was out of town for a week. Thanks for looking at this again.

    I don’t think the new shortcode did anything. I am still seeing the HTML for the arrow images and its still rotating automatically even though no rotate is on. See here:

    http://phoogoodev.com/southpark/about/

    Plugin Author Martin Tod

    (@mpntod)

    This is odd. The links work on my version of your script – http://www.martintod.org.uk/blog/?p=96#more-96 – and link to your graphics. So wp_kses_post() appears to be working differently on your site vs. mine! Do you know if CUSTOM_TAGS is being defined somewhere in your template?

    The other problem is that no_rotate was spelled wrong!

    [rotatingtweets screen_name='applespotlight' official_format='1' rotation_type='carousel' show_meta_reply_retweet_favorite='1' carousel_horizontal='1' show_meta_prev_next='1' np_pos='bottom' prev='<img src="http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_left.png">' next='<img src="http://phoogoodev.com/southpark/wp-content/themes/phoogoo/lib/img/arrow-circle_right.png">' tweet_count='10' no_rotate='1' carousel_count='4' carousel_responsive='1']
    Thread Starter saemosaemo

    (@saemosaemo)

    Strange, when changes no_rotate it breaks the whole thing and the tweets go vertically, so I had to take it out. I can maybe live with auto rotate but the next/prev arrows need to be an image. On your example the next/prev buttons are not showing. Any thoughts on that?

    I am not sure if custom_tags is being defined, where would I find that?

    I saw that there was a new update for the plugin would that help the wp_kses_post() behavior? Or is the version I am using the development/beta version?

    Thanks!

Viewing 15 replies - 16 through 30 (of 57 total)

The topic ‘Horizontal Carousel’ is closed to new replies.