Crafting the visual aspect of your webshop is a critical step in engaging and maintaining an audience. This guide will walk you through the different visual settings you can manipulate to create an aesthetically pleasing webshop.
Before you start customizing
Settings > Visual settings > Theme Settingson your
TronShop's portal to begin customizing your product cards. Here, you'll find a host of options to choose from.
Grow your business
If you need help customizing your theme, then you can hire a PromoTron expert! Tailor Your Online Shop to Perfection, Attract Customers, and Boost Sales. Embrace the Power of Customization Today! Contact us to book online consultation.
On this page
Add your logo
Your logo is the visual representation of your brand. It's often the first thing visitors notice when they land on your page, and it helps set the tone for their overall experience. Make sure to upload a clear and recognizable logo.
PLEASE TAKE ATTENTION
The image should be in PNG or JPG format with a maximum size of 250 x 100px for optimal display.
The layout of your page determines how content is displayed and interacted with. You have two options to either display:
1. Whole screen
2. Centered (where content fits within a width of 1400px)
A fullscreen layout offers a more immersive experience, while a centered layout provides a more traditional, streamlined browsing experience. Choose a layout that best aligns with your brand and user experience goals.
Your visual style can either be flat or 3D. Flat design is a minimalist style devoid of any shadows or 3D effects, while a 3D design includes light shadows to give elements a sense of depth.
Flat design tends to convey modernity and simplicity, whereas 3D designs can provide a more tactile and immersive user experience.
The shape of your design elements can either be sharp or rounded. Sharp edges give your
TronShop a sleek, modern look, while rounded edges offer a softer, friendlier vibe.
These subtle differences in shape can significantly influence the feel of your site, so think about the image you want to project to your customers when making this decision.
The fonts you use can have a significant impact on the readability and overall aesthetic of your site. We offer several combinations such as Rajdhani/Roboto, Lora/Open Sans, Montserrat/Open Sans, and Rajdhani.
Each of these pairs balances a distinctive header font with a more neutral body text font, ensuring that your text is both engaging and easy to read.
Want to add your own font? It is possible using External Scripts.
Icon style colors
The style of your icons can also contribute to the overall look and feel of your
TronShopwebshop. You have the option to display your icons in a circle, a square, or a square with a rounded radius.
Each of these styles can contribute to a unique aesthetic, with circles often perceived as more organic, squares as more formal, and squares with a rounded radius providing a balance between the two.
Separators are useful tools in web design, helping to distinguish between different sections of a page. You can choose to separate sections by background colors, thin edges, or thick borders. Each of these styles provides a different visual break, helping to guide the viewer's eye and make your
TronShop more navigable.
Colors significantly contribute to the overall feel of your
TronShop, and using them strategically can create a cohesive, visually engaging experience for your visitors. Whether you're setting up a preset color theme or creating a custom palette, this guide will explain how to make the most of your webshop's color settings. Don't forget to switch card to
Preset color theme
If you're new to web design or want a quick setup, our preset color themes are a great starting point. We offer 12 professionally designed themes to choose from, each carefully balanced to ensure a pleasing aesthetic.
Just click button and choose your most favourite.
PLEASE TAKE ATTENTION
Manually changing the colors will overwrite the selected preset theme.
Custom color theme
If you prefer to personalize your site or want to match your brand's specific colors, using a custom color theme allows you to fine-tune your
TronShop's color scheme.
To set up your own colors just swtich to
When customizing your
TronShop's color palette, it's crucial to understand the various elements that make up the overall design. Each section - the base, header, content, and footer - offers unique opportunities to reinforce your brand and create a memorable user experience. Here's a closer look at each category of custom color elements you can adjust:
The base of your webshop's color scheme consists of three elements:
Primary Color Elements
This is the dominant color in your color scheme. It's often the color most associated with your brand and used in the main elements like buy button in product listing, parent category, parameter buttons.
Secondary Color Elements
This color provides a contrast to your primary color. It's usually used for secondary buttons, listing, links or highlighted text.
Default Color Elements
These are the colors used for general text and background areas not covered by the primary and secondary colors.
The header of your site often contains your logo, navigation bar, and possibly a call to action. It's the first thing visitors see, so its colors should align with your brand.•
Header Top Area- the color of the background at the top of your header.
Header Top Area Links- the color of any links located in the top area of your header.
Header Main Area- the color of the main area of your header, which usually contains your site's main navigation.
Navbar- the color of the navigation bar itself.
Navbar Links On Mouse Over- the color of link when moused over by visitor. them.
The content section is where the bulk of your site's information will be displayed.
Content Page Colors - the background color of your content pages.
Boxes - the background color of product or category card, filter box any other boxes used to highlight or separate different sections of content.
Group Header - the color of the headers for different content groups.
The footer is often used for contact information, additional navigation, and legal information.
Footer - the background color of your footer and color of contact information.
Footer Links - the background color of any links located in your footer and they color.
Please note that not all the elements' colors can be changed in theme colors, some elements require changes via External Scripts. In case you are having difficulties setting up colors using external scripts, we recommend you to reach your IT, as some technical knowledge is required. Alternatively, you can reach directly our support team and book online session.
Get help with customizations
By carefully considering each of these color elements, you can create a custom color theme that reinforces your brand and creates a memorable browsing experience for your customers. Remember that consistency is key – while it's important to have contrasting colors to guide your visitors' eyes, your color choices should be cohesive and aligned with your brand's overall aesthetic.
Below is an example of customized
TronShop theme for our client Vossa Store:
If you need help with making changes to your theme, then simply Contact our Support team to schedule your session and let us help you with customizing your TronShop!