WordPress.org

Ready to get started?Download WordPress

Forums

[Theme: Reddle] Responsive tweets (8 posts)

  1. hkalant
    Member
    Posted 2 years ago #

    Hello people,

    I am using Reddle on my blog. I know it hasn't been added on the WordPress Repository yet, but I installed it via svn (revision 20913).

    I love its responsive design, but when I resize the window, the tweets that are embedded in my posts stay in the same size.

    How can I fix this?

    Is this Twitter's fault? or is it gonna be fixed in future revisions?

    Thank you.

  2. Kurt
    Member
    Posted 2 years ago #

    hkalant:

    The size of the box is defined by the plugin CSS.

    Add this to your style.css file:

    .twitter-tweet-rendered {
    max-width: 100% !important;
    }
  3. hkalant
    Member
    Posted 2 years ago #

    Hello,

    Thanks!

    It doesn't work though.

    I don't use a plugin to embed tweets. I use the new WordPress 3.4 feature by just pasting the tweet link in my post.

  4. Kurt
    Member
    Posted 2 years ago #

    hkalant:

    First, let's make sure that we're talking about the same thing. You're talking about the boxes next to the large double quote, correct?

    If that's true, then it looks to me like there's a twitter widget involved because the id of the first box is id="twitter-widget-0". But that doesn't matter because the CSS is setting a specific size for the box at 440px.

    I tested the CSS I provided by using Firefox and Firebug. It does work. But, I determined where the current CSS originates. It's coming from: http://platform.twitter.com/embed/embed.css . This appears to be a CSS file from twitter. This CSS file is loaded last, so the specification in this file of max-width: 550px !important is applied. Because it's last, it overrides anything before it - like style.css.

    I assume this file is being loaded automatically. If not, remove it from whatever is loading it. Other options: 1) Use another technique for adding your tweets; 2) Load a CSS file after embed.css that includes the CSS I provided.

  5. hkalant
    Member
    Posted 2 years ago #

    Yes, we are talking about the same thing.

    (Can you still see the large double quote? I thought I deleted it...)

    Anyway, it seems that embed.css is being loaded automatically and last.

    Is there any way for the style.css to be loaded last?

  6. Kurt
    Member
    Posted 2 years ago #

    You'll need to create a child theme.

    One option would be to load a new CSS file using the wp_head hook.

    The other option would be to copy the header.php file, modify it and upload it to the child theme. The modification would be to load the existing style.css file after the wp_head hook. It appears that the twitter css file is being loaded by using the wp_head() hook.

  7. hkalant
    Member
    Posted 2 years ago #

    Ok, I will try these options. Thanks again!

  8. YoArts
    Member
    Posted 2 years ago #

    .post .twitter-tweet-rendered {
    max-width: 100% !important;
    }

Topic Closed

This topic has been closed to new replies.

About this Topic