Wishlist icon text not appearing in icons group over products
-
My YITH Wishlist plugin is not working properly. When we hover over its icon (on the icons group on products), it only display a black rectangle and no text where the other two icons show compare and quick view when we hover over them. I have installed the plugin and reinstalled it but still didn`t work. Moreover, when we open the Wishlist page, it is buggy at start. The social icons on it are in awkward shapes until we remove a product from our Wishlist and the whole page shifts up a bit and the icons return to their original shape. You can visit the shop page on link attached and try this out. Guide me as to how to resolve this.
The page I need help with: [log in to see the link]
-
Hello there,
thanks for contacting us!Please add the following code in the functions.php file of your active theme and check if it solves the problem:
if (!function_exists('yith_wcwl_enqueue_back_required_assets')) {
function yith_wcwl_enqueue_back_required_assets()
{
$suffix = defined('SCRIPT_DEBUG') && SCRIPT_DEBUG ? '' : '.min';
$version = defined('WC_VERSION') ? WC_VERSION : '';
wp_enqueue_style('woocommerce_prettyPhoto_css', plugins_url('assets/css/prettyPhoto.css', WC_PLUGIN_FILE), array(), $version);
wp_enqueue_script('prettyPhoto', plugins_url('assets/js/prettyPhoto/jquery.prettyPhoto' . $suffix . '.js', WC_PLUGIN_FILE), array('jquery'), '3.1.6');
wp_enqueue_script('prettyPhoto-init', plugins_url('assets/js/prettyPhoto/jquery.prettyPhoto.init' . $suffix . '.js', WC_PLUGIN_FILE), array('jquery'), $version);
wp_enqueue_style('yith-wcwl-main', YITH_WCWL_URL . 'assets/css/style.css', array('jquery-selectBox'));
}
add_action('wp_enqueue_scripts', 'yith_wcwl_enqueue_back_required_assets', 100);
}
if (!function_exists('ywfav_add_fontawesome')) {
add_action('wp_enqueue_scripts', 'ywfav_add_fontawesome', 99);
function ywfav_add_fontawesome()
{
wp_enqueue_style('fontawsome', 'https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');
}
}Please let us know.
Best regards.
Unfortunately, issue has still not been resolved despite the fact that I purged all cache after making the change and checked on incognito to see if issue has been resolved, but it didn
t. Kindly guide me further; also should I now just remove the code (you sent) from my functions.php file of theme.
Moreover, below is the code that I found for each of my wishlist and compare in the theme functions.php file. If you could have a look at it to see if there
‘s an issue there:/**
* Add product wishlist
* @since Bosa Store 1.0.0
*/
if ( !function_exists( 'bosa_store_head_wishlist' ) ) {
function bosa_store_head_wishlist() {
if ( function_exists( 'YITH_WCWL' ) ) {
$wishlist_url = YITH_WCWL()->get_wishlist_url();
?>
<div class="header-wishlist">
<a href="<?php echo esc_url( $wishlist_url ); ?>">
<span class="header-svg-icon">
<svg width="20" height="20" viewBox="0 0 24 25" xmlns="https://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path d="M18.2753 1.28351C17.1493 1.30102 16.0478 1.61536 15.0821 2.19478C14.1164 2.7742 13.3207 3.59818 12.7753 4.58351C12.23 3.59818 11.4343 2.7742 10.4686 2.19478C9.50289 1.61536 8.4014 1.30102 7.27535 1.28351C5.48029 1.3615 3.78905 2.14676 2.57113 3.46774C1.35321 4.78872 0.707598 6.53803 0.775349 8.33351C0.775349 15.1085 11.7313 22.9335 12.1973 23.2655L12.7753 23.6745L13.3533 23.2655C13.8193 22.9355 24.7753 15.1085 24.7753 8.33351C24.8431 6.53803 24.1975 4.78872 22.9796 3.46774C21.7616 2.14676 20.0704 1.3615 18.2753 1.28351ZM12.7753 21.2125C9.52235 18.7825 2.77535 12.8125 2.77535 8.33351C2.70699 7.06822 3.14172 5.82724 3.98471 4.88121C4.82771 3.93518 6.01058 3.36086 7.27535 3.28351C8.54012 3.36086 9.72299 3.93518 10.566 4.88121C11.409 5.82724 11.8437 7.06822 11.7753 8.33351H13.7753C13.707 7.06822 14.1417 5.82724 14.9847 4.88121C15.8277 3.93518 17.0106 3.36086 18.2753 3.28351C19.5401 3.36086 20.723 3.93518 21.566 4.88121C22.409 5.82724 22.8437 7.06822 22.7753 8.33351C22.7753 12.8145 16.0283 18.7825 12.7753 21.2125Z" fill="#253D4E"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="20" height="20" fill="white" transform="translate(0.775391 0.366516)"/>
</clipPath>
</defs>
</svg>
</span>
<span class="info-tooltip">
<?php esc_html_e( 'Wishlist', 'bosa-store' ); ?>
</span>
</a>
</div>
<?php
}
}
}
/**
* Add product compare icon in header
* @since Bosa Store 1.0.0
*/
if (!function_exists( 'bosa_store_head_compare' ) ) {
function bosa_store_head_compare() {
if ( function_exists( 'yith_woocompare_constructor' ) ) {
global $yith_woocompare;
?>
<div class="header-compare">
<a class="compare added" rel="nofollow" href="<?php echo esc_url( $yith_woocompare->obj->view_table_url() ); ?>">
<span class="header-svg-icon">
<svg width="20" height="20" viewBox="0 0 24 25" xmlns="https://www.w3.org/2000/svg">
<g clip-path="url(#clip0)">
<path class="cls-1" d="M23.33,16l-4.72,1.4L19.08,19,21,18.4a10,10,0,0,1-9,4.29h0a8.51,8.51,0,0,1-.9-.11h0l-.78-.17L10,22.35l-.56-.17L9.06,22l-.37-.15-.59-.29a9.94,9.94,0,0,1-5.37-8l-1.64.14A11.65,11.65,0,0,0,7.18,23h0q.45.24.93.45l.11,0c.28.12.57.22.86.32l.2.07.75.19.32.08c.19,0,.39.06.59.09l.49.08h0a11.66,11.66,0,0,0,11-5.28l.63,2.15,1.58-.46Z" transform="translate(-1.09 -1.07)"/>
<path class="cls-1" d="M2.33,8.92,7.11,7.75,6.72,6.16l-1.91.47A10,10,0,0,1,14,2.79h0a8.72,8.72,0,0,1,.89.16h0l.77.2.21.07.56.2.4.17.36.17c.19.1.39.2.58.32a10,10,0,0,1,5,8.25l1.64-.06A11.61,11.61,0,0,0,18.8,2.75h0l0,0a9.75,9.75,0,0,0-.9-.49l-.11-.05q-.41-.19-.84-.36l-.2-.07c-.24-.09-.49-.17-.74-.24l-.31-.09-.58-.13c-.17,0-.33-.07-.5-.09h-.05A11.66,11.66,0,0,0,3.29,5.93L2.76,3.75l-1.59.39Z" transform="translate(-1.09 -1.07)"/>
</g>
<defs>
<clipPath id="clip0">
<rect width="26" height="26" fill="white"/>
</clipPath>
</defs>
</svg>
</span>
<span class="info-tooltip">
<?php esc_html_e( 'Compare', 'bosa-store' ); ?>
</span>
</a>
</div>
<?php
}
}
}Hello there,
Please try adding the following code in the functions.php file of your active theme:
if ( ! function_exists( 'yith_wcwl_fix_tooltip' ) ) {
function yith_wcwl_fix_tooltip() {
$jquery = 'jQuery( document ).ready( function($) {
$( ".yith-wcwl-add-to-wishlist:not(.exists) span" ).text( "Add to wishlist" );
});';
wp_add_inline_script( 'jquery-yith-wcwl', $jquery );
wp_add_inline_script( 'jquery-yith-wcwl-user', $jquery );
}
add_action( 'wp_enqueue_scripts', 'yith_wcwl_fix_tooltip', 99 );
}Could you check it, please?
Best regards.
Well, it has worked. I have removed the previous code you asked me to add and then added this one and it worked. Now, “add to Wishlist” is seen, when we hover mouse over the icon.
However, when we open the Wishlist page, it`s social media icons are glitching (appear to be in distorted shape or something). You can check it through the link attached at start of this issue.Hello there,
Please add the following CSS in Appearance > Customize > Additional CSS:
.yith-wcwl-share li a {
display: flex !important;
}
.yith-wcwl-share .share-button p {
display: none !important;
}Check it out and tell us if it works well for you.
Best regards.
It has worked. Could you explain to me briefly what was the issue and how has it been resolved both in this case and the previous one(“add to Wishlist” not appearing upon mouse hover)?
-
This reply was modified 1 week, 3 days ago by
waqarsaleem.
-
This reply was modified 1 week, 3 days ago by
- You must be logged in to reply to this topic.