Home/ Questions/Q 7943085
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T00:10:00+00:00

I’m having an issue with embedding twitter onto a wordpress run site that I’m

  • 0

I’m having an issue with embedding twitter onto a wordpress run site that I’m converting from HTML 5.

The problem I’m having is that the tweets are not in my custom font…

enter image description here

This is the HTML code that I can’t target with any css, i’m using a custom font imported with css for all the text on the site.

<article id="twitter">
    <h3>Twitter:</h3>
        Test tweet to get embedded code. 
            <a href="http://twitter.com/Max__Chandler/statuses/202020801917095939" class="aktt_tweet_time">28 mins ago
    </a>
</article>

PHP Code taken from Index.php

<article id="twitter">
    <h3>Twitter:</h3><?php aktt_latest_tweet(); ?>
</article>

The css ID as shown in chrome is 

article#twitter (text)

I’ve tried targeting: #twitter, html, body, text, (text), “”.

Someone enligten me as to how I can get this peice of text to be displayed in the font that I’ve chosen – I’d like to just use CSS is possable to keep things simple!

URL:

http://www.msc-media.co.uk

This is how the font is imported using CSS

    @font-face {
        font-family: 'JosefinSansStdLight';
        src: url('/wp-content/themes/1/JosefinSansStd-Light-webfont.eot');
        src: url('/wp-content/themes/1/JosefinSansStd-Light-webfont.eot?#iefix') format('embedded-opentype'),
             url('/wp-content/themes/1/JosefinSansStd-Light-webfont.woff') format('woff'),
             url('/wp-content/themes/1/JosefinSansStd-Light-webfont.ttf') format('truetype'),
             url('/wp-content/themes/1/JosefinSansStd-Light-webfont.svg#JosefinSansStdLight') format('svg');
        font-weight: normal;
        font-style: normal;

    }


    p, a, h1, h2, h3, h4, h5, h6{
        font:'JosefinSansStdLight';
        letter-spacing: 0.1em;
    }
    a{font:1.25em 'JosefinSansStdLight';}
    p{font:1.2em 'JosefinSansStdLight';}
    h1{font:3em 'JosefinSansStdLight';}
    h2{font:2em 'JosefinSansStdLight';}
    h3{font:1.25em 'JosefinSansStdLight';}
    h4{font:18px/27px 'JosefinSansStdLight';}
    h5{font:18px/27px 'JosefinSansStdLight';}
    h6{font:18px/27px 'JosefinSansStdLight';}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The CSS “font” property requires both the “font-size” and “font-family” values to be vaild. Several places in your CSS file, you have the following:

    font:'JosefinSansStdLight';

    This is not valid CSS because it does not include the “font-size” value. You should either include the size like you did for the a, p, h1, h2, h3, etc.:

    a{font:1.25em 'JosefinSansStdLight';}
p{font:1.2em 'JosefinSansStdLight';}
h1{font:3em 'JosefinSansStdLight';}
h2{font:2em 'JosefinSansStdLight';}
h3{font:1.25em 'JosefinSansStdLight';}
h4{font:18px/27px 'JosefinSansStdLight';}
h5{font:18px/27px 'JosefinSansStdLight';}
h6{font:18px/27px 'JosefinSansStdLight';}

    Or, you can change the “font” declarations to “font-family” declarations:

    font-family:'JosefinSansStdLight';
    • 0