Adding custom codes

Using the Custom Code feature found under the Advanced tab, you can add HTML, CSS and JavaScript codes to your marketplace.

Marketplace administrators who have minimal experience with HTML, CSS or JavaScript should not manipulate or add their own codes without professional help as this could disrupt the basic codes of your marketplace website.

However, we understand that sometimes, you may urgently need to make minor tweaks to your marketplace, but do not have the coding knowledge to do so. As such, we have provided some CSS solutions to frequently asked questions to help you out! Simply add one of the codes found at the end of the article into the CSS editor found in the Custom Code tab to make the changes. 

Alternatively, you may wish to refer to this video link for an introduction to custom coding. 

Do note that this feature is only available for subscribers to our Basic Plan and above. Basic plan subscribers get access to .HTML and CSS custom codes feature. Growth plan and above subscribers get access to all three (.HTML, CSS, and JavaScript) custom codes feature.   

* A common enquiry is: "How do I change standard words or texts on my marketplace?" (e.g. changing "Be A Seller" to "Join Now"). To do so, you do not need any coding tweaks--this can be done easily through the Language tab on the admin portal. Read this tutorial to find out more: https://support.arcadier.com/hc/en-us/articles/360018784794-Am-I-able-to-change-standard-words-or-texts-on-my-marketplace-

The following are some CSS codes you may use:

Display all categories 

Insert the following into the Custom Style (CSS) field:

#showmoreCat {display: block !important;}
.section-category .section-title {display:none}

Hide the dates on your marketplace search bar 

Insert the following into the Custom Style (CSS) field:

.home-serach .lala {display:none;}
.home-banner .home-serach .search-controls .form-control { width: 87%;}

Change the color of your marketplace title

 1. Insert the following into the Custom Style (CSS) field: 

.home-banner .banner-quote > h1 { color: #ffffff }

2. Change the “#ffffff” to the hex-code colour of your choice. (#ffffff is the hex-code colour for white.) 

 Before/After result: