Home Forums Pro Themes eVision Corporate Pro clickable fa-icons

Tagged: ,

This topic contains 15 replies, has 2 voices, and was last updated by  wensolutions 3 years, 6 months ago.

Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #1399

    Samuel
    Participant

    During our ux-tests, all of the users believes that the fa-icons are clickable. They are hoovering doing mouse over which gives the impression that they are clickable. Is there a way of making them clickable? I haven’t found it. Otherwise we must stop using that feature.

    #1403

    wensolutions
    Keymaster

    Hello @samuel,

    Currently it would be easier to remove that effect rather than making them clickable.
    For removing that hovering effect, you need to add simple Custom CSS.
    To add custom CSS Go to Admin Panel -> Appearance -> Customize -> Theme Options -> Custom CSS Options.
    Here you will see a box to write custom CSS.Paste below code there.

    .single-circle-icon  span i:hover{
    background-color:#E74C3C  ;
    }

    Note: We assume you have not changed the default icon colors.

    Alternatively, you can make them clickable but need some customization. You need to create child theme and modifying some file.

    Let us know what you are willing to do.

    Regards!!

    #1406

    Samuel
    Participant

    I have a child theme and my manager would like to go with clickable fa-icons, so please advice me on moving on. 🙂

    #1412

    wensolutions
    Keymaster

    Considering that you have already created and activated child theme we would like you to follow steps below.

    Look in main theme’s folder -> inc -> hooks -> front-page , you will find service.php file.
    Copy and paste this file in child theme folder with similar folder structure as in parent.
    Now you need to find matching beginning and ending line and replace with code below:

    <span>
        <a href="<?php the_permalink();?>" >
             <?php if( isset( $evisioncorporatepro_services[$evisioncorporatepro_services_index] ) &&  isset( $evisioncorporatepro_services[$evisioncorporatepro_services_index]['evisioncorporatepro-service-icon'] ) && !empty( $evisioncorporatepro_services[$evisioncorporatepro_services_index]['evisioncorporatepro-service-icon'] ) ){
             echo '<i class="fa '.esc_attr($evisioncorporatepro_services[$evisioncorporatepro_services_index]['evisioncorporatepro-service-icon']).' fa-3x"></i></a>';
            }
               else {
               	echo '<i class="fa fa-desktop fa-3x"></i>';
            	}
            ?>
    </span>

    Hope this will help you to resolve your issue.

    Regards!!!

    #1443

    Samuel
    Participant

    Thanks for the suggestion. A couple of questions:
    – Shouldn’t there be a “</a” termination in the else-statement as well?
    – I have followed your instructions and verified that the changes are in my child theme in the directory structure -> inc -> hooks -> front-page. But the changes does not take effect, even tried to restart apache. I have triple checked the name of the folders and the file. I viewed the source in the web browser and the a-tag is not there.

    #1445

    Samuel
    Participant

    10-15 rows below in the file you have the line

    <?php _e( ‘Know more’, ‘evisioncorporatepro’ );?>

    A suggestion is to replace the text “Know more” with settings from the widget setup panel 🙂

    #1454

    wensolutions
    Keymaster

    Yes, else too should be wrapped with anchor tag like this.

    else {
               	echo '<a href="#"><i class="fa fa-desktop fa-3x"></i></a>';
            	}

    Next,

    To change the ‘Know more’ text you can do it manually which would be much easier for now as shown below:

    < ?php _e( 'Read More', 'evisioncorporatepro' );?>

    But the theme does have option to change ‘Read More’ text through ETdashboard plugin which is packaged with theme. folder/inc/plugins.

    eVision Corporate Pro comes with the bundle plugin eVision Themes Dashboard which is specially created for eVision Corporate Pro theme, that allows you to add any section on the homepage from the widgets block.

    http://themepalace.com/theme-instructions/evision-corporate-pro/

    You can follow above documentation to learn more about it.

    #1455

    Samuel
    Participant

    Thanks, but the main issue is that the changes I have made from your suggestions does not work. It seems that my child theme still uses service.php in your folder structure and not from the theme folder structure. I have checked again and the folder names and the file name are identical.

    #1457

    Samuel
    Participant

    Maybe I need to include a hook to my service.php in the init.php file?

    #1464

    wensolutions
    Keymaster

    Well, let me explain all the process in detail . Ignore the earlier folder structure approach. You can delete that folder from child theme.

    You just need to copy overall codes carefully from below link and paste it in your functions.php file of child theme just below your current code.

    https://goo.gl/LyoaUs

    I have tested it in my child theme which is working well.
    Hope this will solve your issue let us know if any confusion.

    #1476

    Samuel
    Participant

    Got the code in my functions.php but it didn’t help. I have code for other stuff in the file and that executes.

    I changed the line for columns to “<div class=”col-xs-12 col-sm-4 col-lg-4 col-xl-4 col-dm-height”>” and echoing dummy text, but when doing a View Source it only displays the origin code from you “<div class=”col-xs-12 col-sm-4 col-dm-height”>” and no echoing.

    I have emptied the cache and I am using latest Safari and Chrome on OSX

    /Samuel

    #1477

    wensolutions
    Keymaster

    Hello @samuel,
    You just needed to paste that code (above link) in the functions.php file of child theme. No further code customization is needed. However, if your issue is still not solved then we would like to take a look at your child theme’s ‘functions.php’ file. For that, please paste your child theme’s functions.php file codes in the link: https://gist.github.com/ and hit ‘Create public gist’ button and share the link here. That will help us inspect the problem further.

    One more thing, please note that the code we shared earlier via link has no such codes like <div class=”col-xs-12 col-sm-4 col-lg-4 col-xl-4 col-dm-height”> as you have mentioned. So, we hope you have pasted the codes carefully.

    Kind regards,

    #1478

    Samuel
    Participant

    The link is https://gist.github.com/anonymous/6079aecad9d64d9e74c3 or gist:6079aecad9d64d9e74c3

    The development web site is www3.itinforma.se

    No, I am aware of that you didn’t added the columns for the wider screens. That was more a test of “Hello World” to se if the website actually was executing my functions.php. And the columns I added didn’t show up in the web browser’s View Source, but removing other lines of code that existed before your solution, changed behaviour of the web site. So the drives me to the conclusion that the functions.php executes.

    #1479

    wensolutions
    Keymaster

    Hello @samuel,
    After giving you site URL your issue was all clear and found the actual problem. After inspecting your site it was found that you have used etdashboard plugin for your service section in front page.So all the above suggestions didn’t work.

    Now for the solution you need to look into folder named plugins / etdashboard / inc / service /
    you will find widget-service.php file.
    In this file find below start and ending lines and copy and paste below code in that section.

    
    <div class="single-circle-icon">
    	<span>
    		<a href="<?php the_permalink();?>" >
     		<?php
    			$etdashboard_service_icon = get_post_meta( get_the_ID(), 'service-icon', true );
    			if( empty( $etdashboard_service_icon ) ) {
           				$etdashboard_service_icon = 'fa-user';
       			}
     				echo '<i class="fa '.esc_attr( $etdashboard_service_icon ).' fa-3x"></i>';
         		 ?>
          		</a>
           </span>
    </div>
    

    And remove previous codes you added in functions.php file of child theme.
    Hope this will do the trick for you.

    Regards!

    #1486

    Samuel
    Participant

    Thanks a lot for the solution. That was the magic trick. A follow-up question. Editing the code in the plugin, does that mean that I must keep the changes in mind everytime I updates your theme? Or will you incorporate it as a permanent feature in your theme, configurable from the widget panel?

    Thanks,
    Samuel

Viewing 15 posts - 1 through 15 (of 16 total)

You must be logged in to reply to this topic.