SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    731
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    Edit Twitter Feed Script - Add Classes

    Hi,

    I have the following code which displays the last 5 tweets from any Twitter feed I want. However I am unable to edit the link colour or open the link in a new window.

    Can anyone advise how I can use CSS to add classes and open in a blank window.


    Code:
    			<ol>
    			 <div id="twitter_update_list">
    	 <script src="http://twitter.com/javascripts/blogger.js" type="text/javascript">
    </script>
     
    <script src="http://api.twitter.com/1/statuses/user_timeline.json?screen_name=TechCrunch&include_rts=1&callback=twitterCallback2&count=5"  type="text/javascript">
     
    </script>
    
    	</div>
    	</ol>

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,347
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    Using that snippet of code you posted you can change the link colours like this:

    Code:
    #twitter_update_list li a,
    #twitter_update_list li a:visited{
    color:red;
    text-decoration:none;
    }
    You can't open links in a new window using CSS. You would need to change the html or use javascript to do that.

    It's generally not a good idea to force links to open in a new window as that should be the users choice.

  3. #3
    SitePoint Guru
    Join Date
    Feb 2007
    Posts
    731
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Cheers dude. How would I open the link in a new window. It seems quite common for Twitter feeds to open in a new window.

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,347
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    If you look at the link I gave above it gives you a global way to give users the option to set all external links to open in a new window/tab (depending on users browser preferences).

    If you are using jquery then something like this would work.
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Untitled Document</title>
    <script  type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
    </head>
    
    <body>
    <ol id="twitter_update_list">
    <script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script> 
    <script src="http://api.twitter.com/1/statuses/user_timeline.json?screen_name=TechCrunch&include_rts=1&callback=twitterCallback2&count=5"  type="text/javascript"> 
    </script>
    </ol>
    <script language="javascript">
    $("#twitter_update_list a[href^='http://']").attr("target","_blank");
    </script>
    </body>
    </html>


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •