WordPress.org

Ready to get started?Download WordPress

Forums

Social Stickers
[resolved] put the icon in the front page (9 posts)

  1. diskandar
    Member
    Posted 1 year ago #

    hi i have shutter theme installed.

    right now, i have to open the menu first in order to see the icon.

    i wanted to put the social icon in the main page, together with the logo except on the right top corner.

    this is my site:
    http://www.iskandarphoto.com

    Thank you,
    Danny

    http://wordpress.org/extend/plugins/social-stickers/

  2. Boštjan Cigan
    Member
    Plugin Author

    Posted 1 year ago #

    Edit your theme and put (wherever the code for the top right corner is) that inside:

    <?php display_social_stickers(false); ?>

    The stickers will be shown in the mode you have chosen in the settings.

  3. diskandar
    Member
    Posted 1 year ago #

    thank you for the prompt respond.
    i am totally blind about this.
    what file should i edit in the theme? is it the header.php?
    and i don't know what code for top right corner?

  4. Boštjan Cigan
    Member
    Plugin Author

    Posted 1 year ago #

    I wouldn't know that, because I do not know which theme you are using. It depends on the theme really.

    If you'll be moving the logo to the top right corner (assuming you'll be moving it to the black area of the page?) you'll need to edit the HTML/CSS of the theme. And then edit the corresponding file (usually index.php in the theme), that's where you will add the following:

    <?php display_social_stickers(false); ?>

    As for the moving part, I can't help you there because that is a CSS/HTML question (and it would take me time to edit your theme), and you'll need to either hire a designer or edit the theme yourself by learning some basic CSS/HTML.

  5. diskandar
    Member
    Posted 1 year ago #

    thank you.

    no, i don't want to move the logo.

    what i meant was to move the social icons to the main front page at the front top corner of the front page.

    right now the social icons are in the post/page not in the front page.

    i don't know if that makes sense.

  6. Boštjan Cigan
    Member
    Plugin Author

    Posted 1 year ago #

    Top corner of the front page meaning the white border of the page, or above the photos?

    Maybe make a screenshot and highlight the area for better understanding? :D

  7. diskandar
    Member
    Posted 1 year ago #

    it is like hovering on the photos/ on top of the photos. on top of photos and black border. Just like the logo.

    <ahref="http://iskandarphoto.com/temp/sitefrontpagesocialicon.JPG">

    Thanks,
    Danny

  8. Boštjan Cigan
    Member
    Plugin Author

    Posted 1 year ago #

    Try to contact the author of the theme, as the theme is commercial, he should be able to help you in adding an extra div to the photo area.

    Then open index.php in the theme editor and paste the code I have provided in the created div.

    Cheers.

  9. Boštjan Cigan
    Member
    Plugin Author

    Posted 1 year ago #

    If you haven't given up on me you can do the following:

    This is the same code that the plugin you are using on the site now is using, so disable the plugin first if you want to use my plugin instead.

    Go to the theme editor, open file style.css and add:

    #divBottomRight
    {
    position:absolute;
    z-index:10000;
    min-width: 142px;
    }
    #divBottomRight img, #acurax_si_simple img, #short_code_si_icon img
    {
    margin-left:1px;
    }
    #divBottomRight img:hover, #acurax_si_simple img:hover, #short_code_si_icon img:hover
    {
    opacity:0.8;
    }

    Then open footer.php in the theme editor and add the following just before the end </body> tag:

    <div id="divBottomRight" align="right">
    <?php display_social_stickers(false); ?>
    </div>
    
    	<script type="text/javascript">
    	var ns = (navigator.appName.indexOf("Netscape") != -1);
    	var d = document;
    	var px = document.layers ? "" : "px";
    	function JSFX_FloatDiv(id, sx, sy)
    	{
    		var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
    		window[id + "_obj"] = el;
    		if(d.layers)el.style=el;
    		el.cx = el.sx = sx;el.cy = el.sy = sy;
    		el.sP=function(x,y){this.style.left=x+px;this.style.top=y+px;};
    		el.flt=function()
    		{
    			var pX, pY;
    			pX = (this.sx >= 0) ? 0 : ns ? innerWidth :
    			document.documentElement && document.documentElement.clientWidth ?
    			document.documentElement.clientWidth : document.body.clientWidth;
    			pY = ns ? pageYOffset : document.documentElement && document.documentElement.scrollTop ?
    			document.documentElement.scrollTop : document.body.scrollTop;
    			if(this.sy<0)
    			pY += ns ? innerHeight : document.documentElement && document.documentElement.clientHeight ?
    			document.documentElement.clientHeight : document.body.clientHeight;
    			this.cx += (pX + this.sx - this.cx)/8;this.cy += (pY + this.sy - this.cy)/8;
    			this.sP(this.cx, this.cy);
    			setTimeout(this.id + "_obj.flt()", 40);
    		}
    		return el;
    	}
    	 JSFX_FloatDiv("divBottomRight", -170, -65).flt();
    	</script>

    Cheers!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic