Shape 5

Joomla Templates => Campus Life - Club => : steviegoog March 22, 2016, 01:24:35 PM



: Social Icons
: steviegoog March 22, 2016, 01:24:35 PM
Hi im trying to remove the social icons and replace with a very simple image of  tripdadvisor logo that links to the tripadvisor review page. 

The problem im getting is i cant seem to find where to remove the share icon .

 


: Re: Social Icons
: jonahh March 23, 2016, 12:29:34 PM
Hello,

The social icon is actually located in the index.php file. Just look for the below near the bottom of the file and the span is the icon:

:
	<?php if($s5_pos_custom_7 == "published") { ?>	
<div id="s5_socialicons">
<div id="s5_socialicons_active">
<?php s5_module_call('custom_7','notitle'); ?>
</div>
<span class="ion-android-share-alt"></span></div>
<?php ?>


: Re: Social Icons
: AquaClub April 07, 2016, 12:10:52 PM
I have problem with the social icon on mobile devices. Since it is not possible to hover on the social icons button when using mobile device, people need to touch on the share icon to see social icons and when they do so, the social icon on the bottom is activated. So the site goes to the social site directly. To solve this problem, I want to get rid of the share icon and leave the social icons as if they are active at all times.

How can I do that? Can you please help?

Thank you.

 


: Re: Social Icons
: jonahh April 08, 2016, 12:19:25 PM
Hello,

To have them show at all times just change the below display to block and this should do it:

:
#s5_socialicons_active {
    background: #fff none repeat scroll 0 0;
    border: 1px solid #fff;
    bottom: 0;
    display: block;
    left: -1px;
    padding-top: 7px;
    position: absolute;
    width: 42px;
}

template.css line 2777


: Re: Social Icons
: AquaClub April 08, 2016, 12:44:05 PM
It works perfectly! Thank you so much.


: Re: Social Icons
: bushidoe July 13, 2016, 09:24:38 PM
Hello,

Social icons functionality do work on your demo site as expected using a mobile device but it won't work on a clean install (at least not in my case either). AquaClub clearly explained the wrong behavior.

I do want to stay with original functionality, please advice on how to solve this issue.

Thank you.


: Re: Social Icons
: mikenicoll July 16, 2016, 04:58:39 PM
Hello,

Can you post a URL to your site illustrating the issue? I checked on my local copy and not seeing any issues with the icons. Ensure they are enabled in the Template Manager and that you are using the proper markup to call the icons.

Mike


: Re: Social Icons
: bushidoe July 18, 2016, 08:32:38 PM
Hello Mike,

Thank you for your immediate reply.

I removed RSS icon because I don't use it and I think that is where the problem lies. It seems the issue happens only on mobile devices when the last social icon, the one right behind the share icon, is enabled with an href attribute. I just reinserted RSS icon with no link and the problem ended.

You can replicate the issue by activating your last social icon, i.e. RSS icon in demo site, with a link.


: Re: Social Icons
: mikenicoll July 19, 2016, 10:43:20 PM
Hello,

I just tested installing a fresh copy and applying a URL to the RSS icon. I am not seeing any issues on my PC or mobile device with the icons.

Regards,


: Re: Social Icons
: bushidoe July 20, 2016, 09:21:37 PM
Hello Mike,

It seems this issue has to do with "Ghost clicks" in mobile browsers.

Here you have two examples of this common problem:

"When users tap the screen on an iPad, iOS sends the TOUCHSTART and TOUCHEND events which jQuery Mobile treats as a "tap". But then 300ms later, iOS sends a "click" event. If I respond to the "tap" by advancing to the next page before the "click" occurs then the next page receives the "click" and if a button on the new page happens to appear in the location of the tap then it gets clicked."

"Now the app is performing slightly better on the phone. However, it is performing a touch click, and then a regular click, ie potentially double clicks, or when the next slide comes in, it clicks on something there. In my case a form is appearing, and the input field that appears in the space where the button clicked was, is selected. Ghost click."

The simplest workaround for me was to include the "ion-android-share" icon itself as the last social icon with no URL applied. This way the ghost click has no effect on my site.


: Re: Social Icons
: mikenicoll July 22, 2016, 09:46:56 PM
Hello,

Alright glad you got it sorted with your workaround. iOS definitely has some strange functionality sometimes.

Regards,