TABLE OF CONTENTS
THEME GENERAL SETTINGS
GOFARM is a 2.0 Shopify theme, it includes all the latest features that the modern stores need. This theme is an ideal one specially designed for large catalog and varied-product stores. Now, let's have a look at the theme general settings.
I. App Integration
First of all, please read the App integration guide to avoid unnecessary errors. We suggest using our recommended apps to get more compatible with the themes.
1. Metafields & Custom Fields app
->> Go to this link to install the app
2. Wishlist Compare app
->> Go to this link to install the app
3. Product Review
There are 3 options for you to choose which app will help you to display your customers' reviews
II. Multiple Currency
Choose an option to display your store's payment and currency
1. SOURCE
- Multiple Currencies by Shopify: this is only available for stores using Shopify Payments. Please refer to this article for more information.
- Multiple Currencies by ArenaCommerce
- Disable: turn off the function
2. CURRENCY FLAGS
4 options to display:
- Rectangle
- Circle
- Square
- Hidden
(Note that cart and checkout totals will always show the currency code, and itemized, unit, and installment prices will not)
3. CURRENCY FORMAT
2 options for showing the currency format on your website (with or without monetary unit)
Multiple Currencies By Arenacommerce
Add more currencies to your store by type the monetary units to the text box (separate each value by a space)
This section is for modifying the theme font throughout the site. There are several elements for you to change individually
- Font Family (Insert the font name or font code into text boxes to set the font throughout the theme). You can visit Google font gallery here
There are several elements to modify:
- Heading font size, font weight (you can modify each heading font individually)
- Body font size, font weight
>>>The Heading font size format:
- If you insert only one value (eg: 45px), the heading will display with 45px regardless of the interfaces Mobile or Desktop
- If you insert 4 values (eg: 45px, 50px, 55px, 60px), the values will be applied following the order: Mobile (45px), Tablet (50px), Desktop (55px for desktop with the small screen), Desktop (60px with bigger screen)
Headings of the different sections:
- Heading 1: Blog post heading...
- Heading 2: Comment section heading...
- Heading 3: Recently viewed products heading...
- Heading 4: Product name...
- Heading 5: Frequently bought together section heading...
- Heading 6: Related products section heading…
If you don't know how to modify the gg font for the theme, here are two ways to change the gg font for the theme
01. Insert the font name (just copy the font name at the gg font gallery and paste it into the box)
eg: This will change the Heading font of the theme
>>> You can view how to insert the font name via this clip
02. Insert the font code
Choose a font from the gallery, click on it and add the styles (you can choose more than one style if the font has several styles)
>>> Copy the bold text of the link and paste it into the box you want to change the font (view this link to get the detail)
Note: Because you've set its font weight when selecting styles, you can only switch between/among them.
For example font code: Dancing+Script:wght@400;600 → only font weight value 400 or 600 can be active. Other values will be disabled.
- Italic style is not supported. - Only insert one font in each text box (Google header font & Google body font field).
III. Color & Style
1. THEME LAYOUT
LTR or RTL (left to right/ right to left). Remember this is set for the whole theme
- Container Width: insert the value with pixel unit (eg: 1240px) make sure it fits with your device screen
- Spacing: insert values as your wish (eg: 10px, 20px)
- Border radius: the bigger the number is, the rounded the image will be
Favicon: Insert the image to the favicon (.png file, size is 32x32)
2. COLOR
- Primary color
- Secondary color
- Miscellaneous color
These colors will be applied to many elements throughout the website, you can modify each element individually in its section.
>>> View the example to see which elements are applied on the homepage
These colors will be used for divided, border, ..
- Page Background color
- Text color
- Subtext color
- Form background color
3. LABEL COLORS & STYLES
This section is to set the colors for 3 available labels
Sale label background color
Sale label text color
Hot label background color
Hot label text color
New label background color
New label text color
>>> Learn how to Add labels to products
4. IMAGE STYLES
Image loading effect
- Opacity
- Blur
- Slide up
- Scale up
5. HEADER
Tick the box to enable the functions:
- Enable Announcement bar
- Enable Mega menu
- Enable Mega menu tab
>>> View the details via this CLIP on how 3 features was applied
- Header Sticky style: there are 2 options for you to decide how header will be sticky
- Scroll down to show (when you scroll the mouse down, the header is still be shown)
- Scroll up to show (when you scroll up, the header will stay shown, but when scroll down it disappears)
- Styles & Colors
- Header Background opacity: drag to adjust the opacity level for the header background
- Using the color pickers to modify the Background color, Form background color, Text color, Menu text color
- Menu text font weight: drag to adjust
- Menu text font size: type the value in pixel unit to define the text font size on the header
- Header overlay
- Header Background opacity: drag to adjust the opacity level for the whole header
- Text color
>>> View how it's modified, go to this clip
- Header layer overlay
- Overlay opacity: drag to adjust the opacity level of the header layer overlay
- Overlay color
- Dropdown menu color
- Using the color picker to adjust the Dropdown background color, Dropdown Text color
- Dropdown Text font weight: drag to adjust the text font weight
6. FOOTER
- Check the tick boxes to enable:
- Enable Footer widget
- Enable Icon list
- Colors
Using the color picker to adjust:
- Background color
- Heading Text color
- Text color
- Second Text color
- Menu text color
- Second Menu text color
- Font styles
- Drag to adjust title font weight
- Type the values into the corresponding boxes to adjust Title font size, Text font size, Menu text font size
7. PRODUCT CARD
Mark the check-boxes to enable the features on the product items
- Show Product weight
- Show Sale (label) with percent
- Show product quantity (when you add an item to cart, it will show a quick change product quantity right at this item. And the quantity of the product will be automatically changed in the cart)
- Limit card title line: choose the one from 4 options
- Cart button position: Hidden/ On the product image/ At the bottom card
- Cart button style: there are 3 available styles (1,2,3) for you. If you don't see them satisfactory, you can create your new one at the Theme Config (and add Default Button block) to modify as your wish.
>>> Learn how to modify the Cart button style at Theme Config
- Card image: there are several options for you to choose the ratio for the image. Just choose the one that fits your wish. (for the best result, you should upload the images with the same ratio)
- Hover effect: choose an option to display
8. CART
- Cart styles: choose an option to display the cart (Cart page/ Dropdown/ Popup/ Side bar)
- Effect added to cart: select an option to decide the effect when adding to card
- Card image: choose an option to display the image ratio on the cart
9. SEARCH
- Search item type: you can choose to display only the Product or Product, Page, and Article when searching
- Unavailable result: choose to Hide or Show the sold-out items, or show the unavailable items at the end of the list (behind the available items)
- Search suggest: tick to the check box to enable the search suggest
- Limit: limit the number of items that show on the dropdown searching
10. SOCIAL ACCOUNT
- Social sharing: Tick on the check-box to display the social icons on the product page
- Social media: insert the URL links of your social medias, they will show at the footer of the website
11. CHECKOUT
- Background image: choose an image from the library or upload your own one to set the checkout background image (or you can leave it blank to set it as the default white background)
- Logo
- Position: choose an option to set the position for the logo (Left/ Center/ Right)
- Logo size: choose an option that fits your wish
Main content area
- Background image
- Background color: if you want the minimal style, you can set color foe the background only instead of the image
Order summary
- Background image
- Background color
Typography
Select the Headings and Body fonts for the Checkout
Colors
- Accents: set color for Links, highlights, and checkmarks
- Buttons: set color for Gift card/discount and next step buttons
- Errors: for Messages and invalid fields
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article