RakoSell / Articles

Elevate Your Rakosell Store Design with Simple Coding Tricks

Posted at:09/05/2023

#tutorial   #Web design  

Rakosell is an excellent e-commerce platform that allows you to effortlessly create and manage your online store. This article introduces some simple programming tricks for Rakosell users to beautify web pages in the backend website design, enhancing the user experience. These techniques only require basic knowledge of HTML and CSS, without the need for advanced programming skills.

In the Rakosell backend under "Site Settings," you can input various custom codes in Custom HTML to effectively optimize your website. Below are some commonly used codes by the editor (it is recommended to paste the code within the <head> tags):

  1. Making the Navigation Bar Transparent

To make your Navigation Bar transparent, you can use the following code:

<style>
body .rs-merchant-navbar {
box-shadow: none !important;
}
.bg-nav, .rs-member-nav-bar, .rs-nav-placeholder {
background-color: unset !important;
}
.rb-sticky-top.rs-nav-placeholder {
display:none !important;
}
</style>

  1. Hiding the Footer

If you want to hide the Footer section, you can use the following code:

<style>
.footer-top {
display:none !important;
}
</style>

  1. Hiding the Navigation Bar

If you want to completely hide the Navigation Bar, you can use the following code:

<style>
body .rs-merchant-navbar {
display:none !important;
}
.rb-sticky-top.rs-nav-placeholder {
display:none !important
}
</style>

  1. Customizing Dropdown Menu Colors

To customize the background color of the Dropdown Menu, you can use the following code:

<style>
.custom-dropdown-item-list{
background-color: {{ COLOR }} !important;
}
</style>

In this code snippet, you can replace {{ COLOR }} with your desired specific color (e.g., Red, Blue, etc.), which will change the background color of the Dropdown Menu.

Please note that the !important style rules in these code snippets ensure that your settings take precedence over other styles. By using these simple programming tricks, you can easily enhance the aesthetics of your Rakosell backend pages to meet your design needs. Hope these tips are helpful to you!

Use the limited-time promo code 'freetrial886' now to enjoy one month free on the Rakosell Advanced Plan. Unlock unrestricted access to all Rakosell membership platform features.