Alkaline Plant Based Diet
Alkaline Plant Based Diet
Menu

How To Style the Google+ Comments For WordPress Plugin Tabs

By | June 2nd, 2013 | Modified - December 4th, 2014

Google+ Comments For WordPress By Brandon Holtsclaw

Styling The Google+ Comments For WordPress Tabs
Styling The Google+ Comments For WordPress Tabs

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.

Google+ Comments For WordPress Tabs Before

Restyling the tabs I was able to make them look more interactive.

Google+ Comments For WordPress Tabs After

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.

Google+ Comments Edit

2) You will be brought to your CSS stylesheet. Mine is below.

Google+ Comments Edit Stylesheet

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.

Google+ Comments Edit 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.

Google+ Comments Plugin Edit

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.

Google+ Comments Plugin Edit

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: , , , , ,

ADVERTISEMENT - Why do I see this?
Alklaine Plant Based Diet

About Author:

Aqiyl Aniys is the author of the books Alkaline Herbal Medicine, Alkaline Plant Based Diet and the children's book, Faith and Justice eat an Alkaline Plant Based Diet." He received a certificate in plant-based nutrition from Cornell University, a BA in Organizational Behavior and Communications from NYU, worked as an elementary school teacher, and studied social work. He enjoys boxing, kick boxing, cycling, power walking, and basically anything challenging, and his alkaline plant-based diet supports all that he does. Learn more about transitioning to an alkaline vegan diet using the Dr. Sebi nutritional guide.

ADVERTISEMENT
ADVERTISEMENT
JOIN US