Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

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

[SOLVED] Xhanch Twitter Plugin: Styling for Atahualpa


  #1  
Old Jul 31, 2010, 01:24 PM
hlietz
 
45 posts · Jan 2010
Does anyone use the Xhanch Twitter Plugin and knows how to style it for Atahualpa?

The plugin offers the following code. But I don't know where to change to make it fit to Atahualpa. For example the text is too narrow and too close to the bars on the left side.

{xmt_id}.xmt hr{
height:1px;
width:100%;
color:#000000;
}

{xmt_id}.xmt .header_48{
height:48px;
line-height:48px;
vertical-align:middle
}

{xmt_id}.xmt .text_18{
font-size:18px
}

{xmt_id}.xmt .img_left{
float:left;
margin:0 5px 0 0;
border:none
}

{xmt_id}.xmt_list{
padding:0px;
margin:0px;
border:1px solid blue
}

{xmt_id}.xmt ul{
padding:0;
margin:0;
line-height:150%;
list-style:none;
}

{xmt_id}.xmt ul li.tweet_list{
font:inherit;
text-indent:0;
background: none;
padding:0;
margin:0;
display:block;
white-space: normal;
word-wrap: break-word;
color:inherit
}

{xmt_id}.xmt .tweet_date_gray{
font:inherit;
color:gray;
font-style:italic;
}

{xmt_id}.xmt .tweet_date_black{
font:inherit;
color:#000000;
font-style:italic
}

{xmt_id}.xmt .tweet_date_white{
font:inherit;
color:#ffffff;
font-style:italic
}

{xmt_id}.xmt .tweet_date_red{
font:inherit;
color:#ff0000;
font-style:italic
}

{xmt_id}.xmt ul li.tweet_list:before{
content:""
}

{xmt_id}.xmt .tweet_avatar{
float:left;
padding:4px 3px 3px 0;
width:48px;
height:48px;
border:none;
display:block
}

{xmt_id}.xmt .credit{
font-size:10px;
text-align:right;
}

{xmt_id}.xmt .credit a{
text-decoration:none;
font-size:10px
}

{xmt_id}.xmt .credit a:hover{
text-decoration:underline;
}

{xmt_id}.xmt .clear{
clear:both !important;
}
  #2  
Old Aug 1, 2010, 11:53 AM
hlietz
 
45 posts · Jan 2010
Here's a screenshot how it looks without changing any CSS.
Obviously the text is too close to the "bars" on the left side (compared with all other plugins). And the space between the lines is too big ...
I tried some changes in the code above (see post 1). But with no success for the first problem. I'm sure it's an easy to solve problem for someone CSS doesn't look like Chinese (as it does for me) ...
Attached Thumbnails
Click image for larger version

Name:	Xhanch_Twitter.png
Views:	1880
Size:	34.1 KB
ID:	648  
  #3  
Old Aug 1, 2010, 12:42 PM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
The plugin may have it's own code you can change in the setting. Other than that you would have to determine the selector for the widget via Firebug or source code and use the appropriate CSS in ATO>Add HTML/CSS Inserts>CSS Inserts.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #4  
Old Aug 1, 2010, 02:16 PM
hlietz
 
45 posts · Jan 2010
The plugin does indeed have its own code (see first entry above). I just can't find the right place to change. Perhaps someone is able to "read" the posted code (I can't) and tell me which things (I think it must be some "margin" or "padding" (?) I have to change.
  #5  
Old Aug 1, 2010, 03:22 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
What is the URL?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #6  
Old Aug 2, 2010, 08:54 AM
hlietz
 
45 posts · Jan 2010
http://dfl.dropforlife.org/
  #7  
Old Aug 2, 2010, 09:09 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
Try this in ATO>Add HTML/CSS Inserts>CSS Inserts
HTML Code:
div#xmt_dropforlife_wid ul li {padding-left:5px !important;}
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #8  
Old Aug 2, 2010, 09:48 AM
hlietz
 
45 posts · Jan 2010
Thanks, Imilesw, that worked – and helped me find an even more elegant solution (directly in the plugin).
I changed the following code-snippet (marked red) in the plugin:
{xmt_id}.xmt ul li.tweet_list{
font:inherit;
text-indent:0;
background: none;
padding-left:5px;
margin:0;
display:block;
white-space: normal;
word-wrap: break-word;
color:inherit
}

Bookmarks

Tags
styling widgets, twitter, xhanch



Similar Threads
Thread Thread Starter Forum Replies Last Post
Styling product page in Atahualpa (using WP e-Commerce plugin) igrowkids eCommerce & Atahualpa 5 Jul 26, 2010 04:22 PM
Twitter plugin divide messages with line marced Sidebars & Widgets 1 May 11, 2010 09:20 AM
Twitter plugin separate last tweets marced Sidebars & Widgets 0 Apr 4, 2010 06:06 AM
Twitter plugin suggestion needed dnavarrojr Plugins & Atahualpa 2 Feb 1, 2010 09:39 AM
[SOLVED] how to add follow me on Twitter icon or twitter widget? ppat2 Sidebars & Widgets 2 May 4, 2009 01:04 AM


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


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