SVG Icon

Hello @jaykaywp,

Please overwrite the following CSS from your theme.

.ccc-favorite-post-count > a::before { }
.ccc-favorite-post-toggle > a::before { }
.ccc-favorite-post-toggle > a.save::before { }

For example :

.ccc-favorite-post-count > a::before {
    content: " ";
    background-image: url(. /your_dir/your_icon.svg);
    background-repeat: no-repeat;
    display: inline-block;
    vertical-align: middle;
    height: 20px;
    width: 20px;
}

Or you can discard the default CSS and have your own style.

Shortcode: [ccc_my_favorite_select_button post_id="" style="your_style_name"]
Shortcode: [ccc_my_favorite_list_menu slug="" text="" style="your_style_name"]
Shortcode: [ccc_my_favorite_list_results style="your_style_name"]

The output will look like the following, so you can freely style it with your theme’s CSS.

HTML: <div class="ccc-favorite-post-toggle" data-ccc_my_favorites-select_button-style="your_style_name">...</div>
HTML: <div class="ccc-favorite-post-count active" data-ccc_my_favorites-menu-style="your_style_name">...</div>
HTML: <div id="ccc-my_favorite-list" data-ccc_my_favorite-list-style="your_style_name" data-ccc_my_favorite-posts_per_page="100">... </ div>

CSS: .ccc-favorite-post-toggle[data-ccc_my_favorites-select_button-style="your_style_name"] { }

Thanks

• This reply was modified 3 years, 5 months ago by Takashi Matsuyama.
• This reply was modified 3 years, 5 months ago by Takashi Matsuyama.

Thanks for the comprehensive reply! Much appreciated