Custom pages

Hi agapikaa,

Thanks for reaching to us.

Provide me with the mockup of the styles that you try to achieve and we’ll send proper instructions if it’s possible.

Regards,

Hi agapikaa,

+ In order to change / translate words. Please make sure you synced the strings first before changing / translating WooCommerce, WoodMart Core plugins and WoodMart theme. You can refer to article

https://xtemos.com/docs-topic/theme-translation/
https://xtemos.com/docs-topic/how-to-make-woodmart-multilingual-with-wpml/

+ You are also need to select the language for the backend and theme settings for admin from the admin user profile, please edit the user’s profile and then select the language for that user it will show the same on the backend.

+ Some strings related to Wishlist / Compare / Login & Register page, you can change in Theme Settings > Shop or Theme Settings > My account https://prnt.sc/W8Tt95stG3YC

Regards,

Hi agapikaa,

Please add the below Custom CSS code to Theme Settings > Custom CSS > Global CSS section:

/* Wishlist icon */
p.wd-empty-wishlist:before {
    content: "\f106";
}

/* Cart icon */
p.cart-empty:before {
    content: "\f147";
}

Here is the list of all our theme icons (including Unicode characters):

$wd-icon-warning-sign: \f100;
$wd-icon-twitter-brands: \f154;
$wd-icon-github-brands: \f155;
$wd-icon-pinterest-brands: \f156;
$wd-icon-envelope-solid: \f157;
$wd-icon-linkedin-brands: \f158;
$wd-icon-mobile-alt-solid: \f159;
$wd-icon-location-arrow-solid: \f160;
$wd-icon-youtube-brands: \f162;
$wd-icon-instagram-brands: \f163;
$wd-icon-flickr-brands: \f164;
$wd-icon-tumblr-brands: \f165;
$wd-icon-dribbble-brands: \f166;
$wd-icon-skype-brands: \f167;
$wd-icon-vk-brands: \f168;
$wd-icon-google-brands: \f169;
$wd-icon-behance-brands: \f170;
$wd-icon-spotify-brands: \f171;
$wd-icon-soundcloud-brands: \f172;
$wd-icon-copyright-regular: \f173;
$wd-icon-facebook-square-brands: \f174;
$wd-icon-whatsapp-brands: \f175;
$wd-icon-odnoklassniki-brands: \f176;
$wd-icon-vimeo-v-brands: \f177;
$wd-icon-snapchat-ghost-brands: \f178;
$wd-icon-telegram-brands: \f179;
$wd-icon-facebook-f-brands: \f180;
$wd-icon-viber-brands: \f181;
$wd-icon-play-button: \f101;
$wd-icon-360-deg: \f102;
$wd-icon-comment: \f103;
$wd-icon-paperclip: \f104;
$wd-icon-header-cart: \f105;
$wd-icon-heart: \f106;
$wd-icon-check: \f107;
$wd-icon-door-logout: \f108;
$wd-icon-more-dots: \f109;
$wd-icon-arrow-circle-left: \f110;
$wd-icon-arrow-circle-right: \f111;
$wd-icon-cross-close: \f112;
$wd-icon-chevron-right: \f113;
$wd-icon-chevron-left: \f114;
$wd-icon-chevron-up: \f115;
$wd-icon-edit: \f116;
$wd-icon-social: \f117;
$wd-icon-filter: \f118;
$wd-icon-sort-by: \f119;
$wd-icon-long-arrow-right: \f120;
$wd-icon-long-arrow-left: \f121;
$wd-icon-grid: \f122;
$wd-icon-cart: \f123;
$wd-icon-user: \f124;
$wd-icon-newlatter: \f125;
$wd-icon-bag: \f126;
$wd-icon-scale-arrows: \f127;
$wd-icon-compare: \f128;
$wd-icon-chevron-down: \f129;
$wd-icon-search: \f130;
$wd-icon-quote: \f131;
$wd-icon-envelope-o: \f132;
$wd-icon-tik-tok-brands: \f133;
$wd-icon-account-wishlist: \f134;
$wd-icon-account-details: \f135;
$wd-icon-account-download: \f136;
$wd-icon-account-exit: \f137;
$wd-icon-account-orders: \f138;
$wd-icon-account-address: \f139;
$wd-icon-account-other: \f140;
$wd-icon-ruler: \f13f;
$wd-icon-account-payment: \f142;
$wd-icon-plus: \f143;
$wd-icon-home: \f144;
$wd-icon-blog: \f145;
$wd-icon-shop: \f146;
$wd-icon-cart-empty: \f147;
$wd-icon-star: \f148;
$wd-icon-star-empty: \f149;
$wd-icon-caret-down: \f150;
$wd-icon-caret-up: \f151;
$wd-icon-caret-left: \f152;
$wd-icon-caret-right: \f153;
$wd-icon-menu: \f15a;
$wd-icon-menu-active: \f15b;
$wd-icon-menu-filters: \f15c;

Regards,

Hi agapikaa,

Please add the below Custom CSS code to Theme Settings > Custom CSS > Global CSS section:

p.cart-empty {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center; 
    text-align: center; 
    min-height: 150px; 
    padding-top: 110px;
}

p.cart-empty:before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%; 
    transform: translateX(-50%); 
    width: 100px;
    height: 100px;
    background-image: url('https://placehold.co/100x100.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    display: block;
}

You can replace the placeholder URL https://placehold.co/100x100.png with your actual image path. But, I kindly recommend you to useSVG` or Font icons for flexible.

Regards,