Support » Plugin: Crafty Social Buttons » page like button on left side floating

Viewing 15 replies - 1 through 15 (of 23 total)
  • Plugin Author Sarah

    (@shen045)

    Yes, there is a floating option. On the settings page, there is an option to make the buttons float, and to choose whether they will float to the left or the right.

    It might make the buttons inside the tabs float also. If that happens, I think it can be fixed with some extra CSS styles.

    Cheers,
    Sarah

    Hi Sarah
    thanks again for previous contribution also replay my query. 2 thinks i am looking for
    1) it will be great if it float inside of tab.
    2) I am also looking for Facebook page like button which will be float in every post and page.
    Have a lice day ahead. As my site looking for donation and i am also working free, if i have i will send you a cup of coffee as you deserve before.
    Cheers
    Rubel

    Plugin Author Sarah

    (@shen045)

    You can make it do pretty much anything you want – it’s completely configurable with CSS.

    While the plugin does come with some default styles that work for most blogs, it was also designed to be completely overridable in your theme CSS.

    Once you have your page layout complete, it’s just a matter of figuring out the appropriate style overrides to add to your theme. But it’s probably best to be sure that your page layout and theme are finalised first.

    And thank you for the thought regarding the cup of coffee! But as yours is also a free service, if you receive any donations, you should put them towards your site.

    Cheers,
    Sarah

    HI
    Please send me css which will forward sharing button inside tab (floating).
    2) I am also looking for Facebook page like button which will be float in every post and page.i have a FB page-dbht1 , so i am looking for people can like my page.
    Cheers
    Rubel

    Plugin Author Sarah

    (@shen045)

    For floating things inside the tab, you can modify the style override you added before to position the tabs wherever you like.

    So, for your page, if you add the following rules to the end of your theme’s style.css file (after the styles you added before):

    div.crafty-social-buttons ul li { display: block }
    .crafty-social-buttons.crafty-social-share-buttons { top: 30px; }
    .ui-tabs .ui-tabs-panel { margin-right: 30px; }

    You can change the top value to make it float at any height you want. If you want them to float at the bottom, you can modify the previous style to this:
    .crafty-social-buttons.crafty-social-share-buttons { top: auto; bottom: 5px; }

    As for the like button, I do plan to see if I can integrate one into this plugin in the future, but it’s probably not something I’m going to be able to do in the next month or so due to other work commitments.

    I’m sure there are other plugins out there with a like button, and I’m pretty sure that all of them can be positioned exactly where you want them with the right CSS overrides.

    Cheers,
    Sarah

    hi Sarah
    thaks again, you did lot of work for me without deserve anything.
    thanks again.
    cheers
    rubel

    hi
    Sarah hope you are fine. I applied the above code in .css to have floating button inside tab, in settings i have also checked float options on right. can you please have a look?
    http://hadithonlinebd.com/2016/04/10/bukhari-2/
    best regards
    rubel

    Plugin Author Sarah

    (@shen045)

    Currently, when you set the buttons to floating, they will use a position: fixed rule to be fixed to either the left or right side of the screen.

    If you add this override to the end of your theme:

    div.crafty-social-share-buttons.crafty-social-buttons-floating {
        position: absolute;
    }

    This tells them that instead of floating within the whole window, they should just float inside their container. In your case, this should make them float within the tab panel. You can change the float to either right or left and choose the height in the plugin options setting. If you want to be more specific about exactly where they are positioned, you can add further override styles.

    Cheers,
    Sarah

    hi Sarah
    Thanks for response. I have added the code as you mentioned, but some question pipping still-
    1) previously i had added code in css-

    .crafty-social-buttons.crafty-social-share-buttons { top: 30px; }
    .ui-tabs .ui-tabs-panel { margin-right: 30px; }

    will i delete previous code?
    2) as you mention of code override and show inside the tab content . will i uncheck “floating option” in settings menu?
    still not it floating outside hear is the link- http://www.hadithonlinebd.com/2016/04/11/%E0%A6%93%E0%A7%9F%E0%A6%BE%E0%A6%B9%E0%A7%80%E0%A6%B0-%E0%A6%B8%E0%A7%81%E0%A6%9A%E0%A6%A8%E0%A6%BE/
    cheers
    rubel

    Plugin Author Sarah

    (@shen045)

    I’m not entirely sure exactly where you want it to float, so I need to know that first.

    Changing the position:fixed to position: absolute will make it float inside the tab panel next to the content, like this:

    https://www.dropbox.com/s/ab1ahjdxdix9c5t/Screenshot%20from%202016-04-12%2020%3A26%3A57.png?dl=0

    Is that what you are trying to do?

    If yes, what you need is:

    1. set the floating option in settings menu
    2. leave the other style overrides in place
    3. add the rule I last gave that sets the floating buttons to absolute rather than fixed
    4. clear your cache

    If not, then I need to know exactly where you want the buttons.

    Cheers
    Sarah

    hi
    social button should float inside of tab in right side. I did as you mentioned but same as no changes. hear i am seeing its float outside rather then inside.
    cheers
    rubel

    hi
    the screen-shot as you give exactly i am looking this…but its showing outside…. 🙁
    cheers
    rubel

    Plugin Author Sarah

    (@shen045)

    If you have a look in your style.css file, you will see right at the end that there is a line of PHP code just before your style override.

    This is a direct link to your CSS file:
    http://www.hadithonlinebd.com/wp-content/themes/Newspaper/style.css?ver=6.6

    This is the line of PHP code:
    <?php if(function_exists('pf_show_link')){echo pf_show_link();} ?>

    You’ll have to remove this – it isn’t valid in a CSS file, and is probably why the style after it is being ignored.

    Cheers,
    sarah

    hi
    i am little bit confused sorry for that, where i find this code? in css i didnt find 🙁 .which like…
    cheers
    rubel

    Plugin Author Sarah

    (@shen045)

    It is the style.css file in your theme. Look at the end of the file where you pasted the style override.

    Cheers,
    Sarah

Viewing 15 replies - 1 through 15 (of 23 total)
  • The topic ‘page like button on left side floating’ is closed to new replies.