Sidebar widgets: Twitter and Tag Cloud
-
Hello…I Installed the above widgets and would like to do the following:
Twitter widget
1. Change font colour to #DDD. I’ve tried the following, but doesn’t work:.SandboxRoot.env-bp-min .timeline-Tweet-text {
color: #DDD;
}
2. Change Tweet bird back to correct blue colour.
3. Change linked (Nilla’s Photography) font colour to green then white on hover, to match my site.Tag Cloud widget
1. Reduce font size of mostly used Tags and maybe increase slightly smaller font.
2. Is a Tag plugin a better option or the Tag Cloud widget?Another question, does my site get hammered by Google if I have the same widgets display on each post, i.e., is this considered as duplicate information? Do you think my widget column is too long now?
Many thanks!
The blog I need help with is: (visible only to logged in users)
-
Hi @nilla2014,
The first one is easy! You’ve almost got it! In your CSS, .timeline-Tweet-text, the word Tweet should not be capitalized.
I’ll take a look at the other questions and get back to you. Others volunteers may chime in with their help as well.
-
Tag Cloud Questions:
1. The font size for each tag is set in its link html. So you would need to select (CSS selector) each link in your tag cloud to change its font size. That’s a pretty hefty bit of coding. To select each link, you can use
a.tag-link-position-1 (or whichever position number you are selecting)
2. I guess it depends on what you are trying to accomplish. I like the randomized look of the tag cloud. But if you want a more organized listing of tags or to be able to group them in some way, then you could go with a plugin.
Google won’t “hammer” your site for having the widgets duplicated. Google is primarily looking at the body and headings of your pages.
As for the length of your sidebar, I took a quick look through your site, and the only page where the sidebar looks long is on the Contact page. You could consider using a different page template for this page if you are concerned about it. The other pages I looked at, the sidebar doesn’t go past the body content, so it looks good to me :)
Still working on the Twitter widget. I don’t think you can change the color of the bird icon as it is an image, so you would need the blue image and then use CSS to swap it out. Swapping out is better suited for Javascript, and there is not a simple way to add Javascript here.
-
Hi again! I believe I have the answer to the last par – The Twitter Widget question # 3.
In your Custom CSS, you can change the color of your name with the following:
.TweetAuthor-name {
color: #40d7bc;}For the hover behavior, you can add the following:
.TweetAuthor-name:hover {
color:#FFF;}Please let us know if you need further assistance.
-
Hi @nilla2014, the twitter timeline widget code comes from Twitter and comes in as an iframe. with iframes from out side sources, there is little we can do to affect the colors or styling within that iframe. I’ve tried a number of things, and am unable to get any of the colors for the elements within the Twitter widget to change.
-
On the tag cloud widget, we can adjust the base font size, which would make all tags the same size, but for anything that is not the smallest size, the theme/WordPress software actually calculates the size and then inserts that font size directly into the HTML, so we can’t really change just the largest since there are no unique CSS selectors for the different sizes. The following would set them all to the same size,
.wp_widget_tag_cloud a { font-size: 16px !important; }but as you will see, it runs everything together and isn’t very user friendly.
-
Sorry I missed all the responses, I forgot to check the ‘notify me’ box below.
Thank you @joyinco and @thesacredpath for all the info.
1. With the Tag, I was trying to reduce the large text as it doesn’t look too good.
2. @Joyinco, couldn’t get that code to work so tried many variations including:
.tweetauthor-screenname.identity-screenname {
color: #40d7bc;
}
Nothing seems to work, so not sure what’s wrong.3. What other layout can I try for the contact page? Maybe I only display the Destination widget and maybe a couple of shares but nothing else on that page?
4. Is it good practise to have tags displayed or not necessary? If so, is there a way that I display Tags to look more professional? A plugin? Not sure if I can use plug-ins on a Premium Plan though.
5. The bird was blue originally, before I started to play around with the widget settings and CSS.
Many thanks again! :)
-
Hi nilla2014,
1. & 4. As @thesacredpath stated, there isn’t a way to target just the tags with the largest text in the tag cloud. Since you are not able to use plugins, the tag cloud would be your best option for displaying tags. It’s up to you if you think your site visitors will want to view posts by tag. You could also use categories instead of tags as there is a simple category listing widget that you can (optionally) have show how many posts in each category. The categories are displayed as a list rather than a cloud.
2. & 5. As @thesacredpath stated, this widget uses an iFrame from Twitter, so the colors come from the iFrame and cannot be changed by targeting the text with CSS. My apologies for not knowing this when I sent my original reply. I’m not sure how the bird was blue and now has changed color. That would come from Twitter. Though you could test out temporarily removing your additional CSS and see if has any affect.
3. Most widgets have a visibility setting. So you could set up some of your sidebar widgets to not display on your contact page if you wanted to make the sidebar shorter on that page.
Good luck getting everything just right!
-
@nilla2014, here is a link to the Widget Visibility section on our Widgets support page.
-
Thanks @joyinco
1. I’am already using the Categories widget to display my Destinations menu.2. Think it’s because I selected “Transparent Background” – before selecting this, it had a white background and blue bird. (I did the CSS test previously but it had no effect.)
Is there a way that I can display My Twitter follow as a static frame/pic but with a URL link to my Twitter page? Displaying someone else’s feed disables the URL link to my page name for some reason.3. Thank you @joyinco, and @thesacredpath for the link. I don’t have any visibility settings in my Customiser>Widgets area nor an “Add Widget” option as per the WP instructions. Instead, I used the Visibility option within each widget, so all cool. Have reduced the widgets quite a bit so think it looks better now – thanks for the suggestion.
4. Is there a way to disable the Comments box just for the Contact page?
Many thanks again :)
-
Hi there, I’ll reply to your follow-up questions in batches:
4. Is there a way to disable the Comments box just for the Contact page?
In the editor on the Contact page, in the More Options panel, uncheck the box next to “Allow comments” – screenshot:
-
Is there a way that I can display My Twitter follow as a static frame/pic but with a URL link to my Twitter page?
Adding a link to a different account isn’t an option in the Twitter timeline widget.
Displaying someone else’s feed disables the URL link to my page name for some reason.
Have you tried un-checking “No Header” and/or “No Footer”? That’s where the link to the Twitter profile is displayed, so since you have your widget set to hide both the header and footer, the profile link isn’t appearing.
-
Thanks @kathrynwp,
I already checked the “No Header” and “No Footer” options when I initially set this up.
As @the sacredpath advised, I’ll add this to the Widgets forum. -
-
- The topic ‘Sidebar widgets: Twitter and Tag Cloud’ is closed to new replies.
WordPress.com Forums 