Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #1011792

    Hi,
    I try to find a solution do make a complete iconbox wrapped with a href tag @ http://dev.plp-group.com. Right now the href tag only effects the title part. Hope that makes sense to you?
    My CSS works well for the visual mouse-over though:

    
    .plp-iconbox:hover {
    background-image: url('http://dev.plp-group.com/wp-content/uploads/2018/09/arrowbox_mo.png')!important;
      height: 181px; 
      background-position: center; 
      background-repeat: no-repeat;
      background-size: cover;
    }

    Would I have to alter a php file?
    Can you help please?
    txs
    Stefan

    PS.: There is a similar post here which I do not understand: https://kriesi.at/support/topic/linking-the-icon-box-icon/#post-183782

    #1011818

    there has to be the link in your iconbox set to have this done.
    give to the icon-box a custom-class: clickable

    then put this into your functions.php of your child-theme:

    function transfer_link_from_child(){
    ?>
    <script>
    (function($){
    	$(".clickable").each(function(){ 
    	    var theLink = $(this).find("a:first").attr("href");
    	    if (typeof theLink !== "undefined"){
    			$(this).addClass("clickme");
    			$(this).on("click", function(){
    				window.location.href = theLink;
    			});
    		};
    	});
    })(jQuery);
    </script>
    <?php
    }
    add_action('wp_footer', 'transfer_link_from_child');

    what does the code do: it looks for the first link in that container with class: clickable – if there is a link it will transfer this link to the container itself.

    if you like to style the newly added class: clickme (see code addClass)
    do this f.e. in quick css:

    .clickme:hover {
    cursor: pointer;
    -webkit-filter: drop-shadow(2px 3px 5px #999);
    filter: drop-shadow(2px 3px 5px #999);
    }

    see here the first iconbox left top: https://webers-testseite.de/iconlists-and-iconboxes-with-h-tag/

    on that page you see the reason for that newly added clickme class. This is only added if there is a link in it.
    if we style directly the clickable class – then behavior will be on hovering the same but no link.

    #1011825

    Thanks Guenni,

    there is another extra function in my childs functions.php, would that be the right syntax (?):

    <?php
    
    /*
    * Add your own functions here. You can also copy some of the theme functions into this file. 
    * WordPress will use those functions instead of the original functions then.
    */
    add_shortcode('avia_search', 'get_search_form');
    
    function transfer_link_from_child(){
    ?>
    <script>
    (function($){
    	$(".clickable").each(function(){ 
    	    var theLink = $(this).find("a:first").attr("href");
    	    if (typeof theLink !== "undefined"){
    			$(this).addClass("clickme");
    			$(this).on("click", function(){
    				window.location.href = theLink;
    			});
    		};
    	});
    })(jQuery);
    </script>
    <?php
    }
    add_action('wp_footer', 'transfer_link_from_child');

    …it doesn’t seem to work though :-(
    … and I admit that I’m not a PHP expert.

    #1011829

    btw: on former Enfold Times this was nice for columns too! – but now Column ALB Element has an input field for link to have the whole column clickable

    #1011834

    That is for inserting the search form by adding shortcode [avia_search] for example to copyright notice or header_meta etc.

    The code should work! – if you gave to your icon-box the custom-class : clickable
    ( in the custom-class input-field insert without dot ! – so not .clickable )

    if you got the merging on Enfold / Performace on ! – you maybe have to refresh the css and scripts.

    #1011840

    if you want to give more than one custom class to an ALB Element just insert the two classnames behind each other with a space between:

    f.e.: plp-iconbox clickable

    #1011843

    Darfst auch gerne vorbeikommen :lol. vom Bonner zum Bonner ?

    Übrigens: du solltes deinem top-header search feld einen höheren z-index geben, auf der ebene wo die obere navigation liegt man das Eingabefeld nicht treffen kann- man muss schon ziemlich zirkeln um ins Eingabefeld zu kommen – daher:

    .av_phone_active_left .phone-info {
        z-index: 5;
    }
    #1011844

    Perfect, my bad. forgot to modify the class in the iconbox!

    #1011850

    @ guenni sorry und vielen Dank …habe dir vorhin einen Privat-reply gesendet, den du als “Participant” sicher nicht lesen kannt. Ich treff mich gerne mal zum fachsimpeln in Bonn wenns passt. schick mir ne mail auf (Email address hidden if logged out) und ich antworte mit meiner ‘anderen’ Mailadresse ;-)

    #1011851

    Thanks to Guenni007 the problem is solved and the topic can be closed.

    #1011858

    hover effect ist jetzt ein wenig too much – oder .
    ist halt doppelt gemoppelt.

    Aber es klappt. Bis dann
    PS : ich bin kein Geheimniskrämer – unter meinem Avatar verbirgt sich meine Internetseite – respektive meine Kontaktdaten.

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