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!
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']
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!
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).
I’ve had a look and it seems to be working!
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!
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.
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
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’>’ 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′]
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
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.
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!
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']
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/
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']
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!