Jump to content
  • Checkout
  • Login
  • Get in touch


The e-commerce.

Support thread for JcM Be Social sidebar Header_tag V1.0


Recommended Posts

A simple add-on to let you place a Social Media sidebar onto your site.

It is based a nice js script by Copyright (c) 2015 José Gonçalves so all credit is his.

It’s been adapted to run on osC Phoenix and fabulous font 5 .

It is a code free install so just copy all the files and go to admin and install. You can edit your links in admin and also select which of the social media icons you wish to display.

The user can hide the display and reveal it as required. It is responsive and will move as page scrolls. It is also mobile compatible so will show on all devices.

It has been tested on Phoenix only. It should however work on other versions that have fabulous font 5

can be seen on this site





Link to comment
Share on other sites

  • JcMagpie changed the title to Support thread for JcM Be Social sidebar Header_tag V1.0

Hi Zahid,

Firstly, thank you for continuing to work on add-ons for CE Phoenix.

This add-on is a great idea in principle.

However at present, on my computer (Safari and Google Chrome) and iphone (Safari), the sidebar remains fixed when the user scrolls. When the user stops scrolling, the sidebar jumps back into position and the user sees it moving vertically across the screen which is distracting and looks a little odd.

Would it be possible to:

  • force the sidebar to move as the user is scrolling so that it may appears to be fixed - just like your 'back to top' add-on? 
  • Or, if not possible or easy, cause the side bar to fade out when the user is scrolling, then fade in again when the user has stopped, so that there is a nice transition rather than jumping from one place to the next?




Support the Project, go PRO and get access to certified add ons

Full-time I am a C-suite executive of a large retail company in Australia. In my spare time, I enjoying learning about web-design.

Download the latest version of CE Phoenix from gitHub here

Link to comment
Share on other sites

Actualy haveing looked at it you can simply remove the scroll fuction from the current add-on and it will be sticky.

In public_html/ext/bs/jquery.besocial.js find line 96 to 115 and comment out like this, now it is sticky and oage will scroll behind it. All other bits will still work. You can set the position from top in the header_tags file by changing the css top.

#contact-buttons-bar {
  position: fixed!important;
  top: 40px;

// Slide on scroll effect
    // Define element to slide
   // var el = $("#contact-buttons-bar.slide-on-scroll");
    // Load top default
   // el.attr('data-top', el.css('top'));
    // Listen to scroll
   // $(window).scroll(function() {
    //  clearTimeout( $.data( this, "scrollCheck" ) );
    //  $.data( this, "scrollCheck", setTimeout(function() {
    //    var nTop = $(window).scrollTop() + parseInt(el.attr('data-top'));
     //   el.animate({
     //     top : nTop
     //   }, 500);
    //  }, 250) );
  //  });
 // });



Link to comment
Share on other sites

  • 7 months later...
  • 2 months later...

Thank you for this add on.2020-07-28_8-42-33.jpg.d572923e3efb9e0e297a4796b9b6499a.jpg

Because G+ is no longer available I replaced that one with a link to a newsletter signup page and changed the FA to /mailchimp/.

I also edited the english/modules/navbar/nb_brand.php to:

define('MODULE_NAVBAR_BRAND_PUBLIC_TEXT', '<font color="b63399"><strong>&nbsp; &nbsp;&nbsp;Follow Us On Social Media</strong></font>');

Finally I moved the position of the >  so it was aligned with the Follow text.

It really works well. 

Link to comment
Share on other sites

On 4/30/2020 at 1:00 PM, mrbangus said:

Is there anyway to move this social links to the right side of the screen so it's not covering up my navigation links?

I think it would be this CSS code in the 

 #contact-buttons-bar {
  position: fixed;
  top: 120px;
  left: -50px;
  width: 50px;
  z-index: 99999 !important;

you would need to change

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...