Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Sidebars & Widgets »

Changing a widget display from block to inline (Twitter Text Widget)


  #1  
Old May 6, 2009, 02:08 PM
Flur
 
29 posts · Dec 2008
I'm using the html twitter widget from twitter (it's not an actual widget, it's html that's pasted into a text widget), and I'm having an issue with the @replies, where the user's name, which is a link, appears on it's own line. I understand that this is because the widgets for the theme are displayed as block rather than inline, but I haven't been able to figure out how to change it for this particular widget. Is there a way for me to do this?

Here's the html from my text widget:

<div id="twitter_div">
<h2 style="display: none;" ></h2>
<ul id="twitter_update_list"></ul>
<a href="http://twitter.com/keriflur"><img alt="" src="http://www.siahdesign.com/images/twit2.gif" width="144" height="30" /></a>
</div>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/keriflur.json?callback=twitterCallback2&amp;count= 3"></script>

Thanks!
  #2  
Old May 7, 2009, 12:18 AM
Flynn's Avatar
Flynn
 
3,768 posts · Oct 2008
Munich, Germany
Look into the source code of the browser-rendered page to see the classes and ID that those Javascripts produce then add a CSS Insert
HTML Code:
div#id-of-widget li a:link,
div#id-of-widget li a:active,
div#id-of-widget li a:visited,
div#id-of-widget li a:hover {
display: inline;
border-left: none;
padding-left: none;
}

div#id-of-widget li {
border-left: solid 5px #123456;
padding-left: 8px;
}

div#id-of-widget li:hover,
div#id-of-widget li:sfhover {
border-left: solid 5px #654321;
}
And for IE6 which doesn't know li:hover, find in header.php this:

HTML Code:
if (document.getElementById("bfa-recent-comments") != null) {sfHover( 'bfa-recent-comments' ); }
and add this after it:

HTML Code:
if (document.getElementById("id-of-widget") != null) {sfHover( 'id-of-widget' ); }
I'll change this border-left decoration style to inline for all widgets then only widgets with multi level items such as the pages and the categories widget will have to get a different style, in the next version.
  #3  
Old May 7, 2009, 11:45 AM
Flur
 
29 posts · Dec 2008
Works perfect. Thanks!

http://thewandergirl.com/

Bookmarks

Tags
display, html, text, twitter, widget

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Text Widget - how can I highlight all text (ctl-A) for a fast delete? Leoni Plugins & Atahualpa 5 Jul 14, 2009 07:38 PM
[SOLVED] category widget can not display inline in v3.4 duping812 New Versions, & Updating 5 Jul 11, 2009 11:10 AM
[SOLVED] how to add follow me on Twitter icon or twitter widget? ppat2 Sidebars & Widgets 2 May 4, 2009 12:04 AM
[SOLVED] How to remove the block next to link in a specific widget? d_random Sidebars & Widgets 2 Apr 30, 2009 01:24 PM
Widget style causing ugly display of widget list, breaks at special characters wfzimmerman Sidebars & Widgets 1 Mar 20, 2009 03:31 PM


All times are GMT -6. The time now is 10:44 PM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.