Tagged: 

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • November 10, 2014 at 12:46 am #348556
    codemode

    What’s the best way to make the team member image link on mobile devices? Currently, the image/link only works on desktop while on mobile you have to tap twice on the small icon underneath the team member image for the link – most people don’t know the icon is the link.

    November 10, 2014 at 3:51 pm #348806
    Yigit

    Hey codemode!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    @media only screen and (max-width: 990px) {
.team-img-container .team-social { visibility: visible; opacity: 1; }
.avia-team-member .team-social { background: rgba(255,255,255,0.3); }}

    Regards,
    Yigit

    November 11, 2014 at 6:44 am #349210
    codemode

    Hmm, didn’t seem to work.

    Basically, the entire image (with the icon), should link through. I noticed on desktop, that although the icon appears over the image, only the icon links through (like a hot spot) and not the entire image. The entire image should be a link.

    Does that make sense?

    Thanks for your help.

    November 11, 2014 at 5:02 pm #349509
    Yigit

    Hi!

    Can you post the link to your website please?

    Regards,
    Yigit

    November 12, 2014 at 12:40 am #349787
    codemode
    This reply has been marked as private.
    November 12, 2014 at 10:24 pm #350401
    Ismael

    Hey!

    Please add this on functions.php to apply the link of the team member social icon to the team image:

    function avf_member_social_link() { ?>
<script>
(function($){
    $(window).load(function() {
    	$( ".avia-team-member" ).each(function( index ) {
			var teamlink  = $(this).find(".team-social a").attr('href'),
				teamimage = $(this).find(".avia_image_team"),
				teamsoc   = $(this).find(".team-social")
			
			$(teamimage).wrap($('<a>',{
				href: teamlink
			}));
			
			$(teamsoc).click(function() {
				window.location.href = teamlink;
			});	  
		});
    });
	
})(jQuery);
</script>
<?php
}

    Add this on Quick CSS:

    .team-social {
cursor: pointer;
}

    You can remove this part of the code:

    $(teamimage).wrap($('<a>',{
				href: teamlink
			}));

    Best regards,
    Ismael

    November 13, 2014 at 12:22 am #350493
    codemode

    I added the css and the code to the bottom of functions.php and that didn’t work either. :/

    November 14, 2014 at 5:42 am #351133
    Ismael

    Hey!

    It works on our installation. Please remove browser cache then test it again. There will be a short delay. Let the load page before testing it.

    Best regards,
    Ismael

    November 15, 2014 at 3:52 am #351670
    codemode
    This reply has been marked as private.
    November 16, 2014 at 3:55 pm #352025
    Ismael

    Hey!

    Please post the login details here. We would like to check it.

    Best regards,
    Ismael

    November 24, 2014 at 1:43 am #356412
    codemode

    Hi – unfortunately, I cannot give login details.

    I just removed all plugins and custom CSS, cleared all cache and it still didn’t work. Not sure what to do next.

    I think KRIESI should add an image link option to the TEAM MEMBER editor! Would make that module complete!

    November 24, 2014 at 7:51 am #356575
    Ismael

    Hi!

    Unfortunately, we won’t be able to help you unless you give us the login details. Please request the feature on our Feature Requests page.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.