1
Comments

If you still didn’t notice, please check again there is a vertical feedback button in my blog , right side. So, sometimes people asks me how to do that ,,, any one can read the source code or having debug tool like firebug for firefox can see the source code and add in his own site. But max time, it’s true that we don’t want to learn by reading or google about any problem, we just ask other to get ready made solution. Even we don’t write in forums about our problems …. grr…

So here is answer of the those question, “How I added the vertical feedback button?”

I know how html works and how css works , I know where to edit in wordpress theme. So many days ago I saw that in a site and copied the source code and image and added in my site
I am showing for default wordpress theme tweentyten and all paths shown bellow are windows style as windows is my primary os.

Step1: Copy this image to your wp-content\themes\twentyten\images folder first.

Step2: Open style.css file from wp-content\themes\twentyten dir and ready to add some css code
Step3: In the file style.css file at last line add the following css codes

body > a#feedbackright {
background:url("images/feedback_tab_white.png") no-repeat scroll 50% 50% #0066CC;
display:block;
height:90px;
line-height:0;
padding:5px;
position:fixed;
right:0;
/*left:0;*/
text-indent:-99999px;
top:50%;
width:22px;
}
body > a#feedbackright:hover {
background-color:#FF8B00;
}

Here if you want to show in left side then comment the right:0; line and uncomment the line left:0; Also if you want to up down the position of the feedback button then edit the value for top:50%

Step3.: Open footer.php from the same dir of style.css file and go to bottom of that file to add the following lines after the end of wrapper div(here I have added the end tag of wrapper div so that you get easily)

</div><!-- #wrapper -->
<a href="<?php echo get_permalink(here will be your contact page id); ?>" id="feedbackright">feedback</a>

look in the above code there is something “here will be your contact page id” you have to replace this text with your contact page id. if you don’t know how to get page id then you can install this wordpress plugin and activate, then go to any menu from left column for listing like posts, pages, categories, tags etc you will see an extra line at right col for id. Ok let your contact page id is 2 then the line will be like

note: here I am writing the last tag of wrapper div

<a href="<?php echo get_permalink(2); ?>" id="feedbackright">feedback</a>

Step4: now it’s time you do it and let me know.