How To Style the Google+ Comments For WordPress Plugin Tabs
Google+ Comments For WordPress By Brandon Holtsclaw
As you can see from my previous post, “Google+ Comments For WordPress – CommentLuv, Facebook, And Disqus Comments In One Plugin,” I have gone ahead and switched over to this commenting system. I was able to keep my WordPress Comments and CommentLuv, and also add Facebook Comments and Disqus Comments. (Google Comments For WordPress has now become “Comments Evolved.”)
It was brought to my attention that it was easy to miss the tabs because of the way they were originally styled. Brandon may get around to restyling the tabs, but I didn’t want to wait and take the chance that people who would comment might overlook the tabs.
Thankfully, the way Brandon coded the plugin, I was able to restyle the tabs using CSS.
The original tabs looked this way, and they do not stand out from the background and may just appear to be an image. They don’t appear to be interactive they way buttons do.
Restyling the tabs I was able to make them look more interactive.
Styling The Google+ Comments For WordPress Tabs
1) In order to style the Google+ Comments For WordPress tabs you will need to add some code to your style sheet. Go to your WordPress admin and place you cursor over the “Appearance” Tab, and then click the “Editor” link that appears.
2) You will be brought to your CSS stylesheet. Mine is below.
3) Before you make a change to your stylesheet you should always make a backup. Highlight all of the text in the stylesheet, copy it, and paste it into notepad. In case you make a mistake, you will still have the original stylesheet.
4) Scroll to the bottom of the style sheet and start a new line.
5) Select all of the text below, copy it.
[raw][/raw]
6) Paste the code where the cursor is, and save. Go and view how your comments look on your blog. You will see that the active gray tab doesn’t have a border around it. You can either leave it that way or you can change it, but it will take a little bit more work. You will need to replace a line of code on the Google+ Comments style sheet.
7) In the WordPress admin panel, hover your cursor over “Plugins” and click on the “Editor” link that appears.
8) Once you are taken to the editor you will choose Google+ Comments from the drop down list and select it. The files for Google+ Comment will show in a list on the right side. Now click gplus-comments/styles/tabs.css to open it in the window. Scroll to the bottom of the CSS file and add a new line as you did before.
9) Select all of the text below, copy it.
[raw][/raw]
10) Paste the text on the new line, and then save. You have finished. Go take a look at your new Google+ Comments For WordPress tabs.
Work To Improve Your SEO And Also Work To Improve Your Health
Though improving your SEO is important, improving and maximizing your health is more important. Simply adding more whole-food plant-based life into your diet, while minimizing your meat and diary intake, can greatly maximize your health living.
Tags: google+ comments, google+ comments for wordpress, google+ comments for wordpress tabs, plugin, style google+ comments tabs, tab
