Site Issues
Hello! I'm having an issue with the following:
Products/Shop Page Layout
- I would like to replicate the style of the shop page and individual product page shown in the Flower Template: https://themes.muffingroup.com/be/flower2/shop/.
- How can I apply this style to the Lottie pre-template I am using?
- Also, I don't see a template option for products as seen in the video tutorial.
Gap at the Bottom of Wraps
- There is an unwanted gap at the bottom of wraps.
- Where can I edit or remove this gap?
- See page: https://staging.chaedesign.com/alasamedia/home2-145/
- Screenshot attached: Screenshot 2024-12-16 at 11.05.20 PM
Photo Border Radius Issue
- Photo Gallery on the bottom of page /Home2-145 had rounded edges (65px), but after making a global update for colors, the rounded corners disappeared. Under the SHOP collection section
- How can I reapply the 65px border radius globally?
- Is there a way to make these images link to a separate page or arrange featured products to look like this?
- See page: https://staging.chaedesign.com/alasamedia/home2-145/
- Screenshot attached: Screenshot 2024-12-16 at 10.53.41 PM
Adding a Video Popup to a Section
- I would like to add a video popup to a specific section with a video, but I can’t figure out how to implement it.
- What is the best way to create a video popup in this section using the theme’s tools or recommended methods but keeping the placeholder. I don't have the "popup page" option as in your tutorial video.
- Screenshot attached: Screenshot 2024-12-16 at 11.09.50 PM
Header Height
- I am trying to adjust the height/padding of the header/main-nav, but the height option in the header settings doesn’t seem to work.
- How can I properly edit the height or padding of the header to achieve the desired look?
- Is there a way to edit the transparency of the sticky header?
Comments
Hi,
1a) This demo is using shop layouts from Betheme -> Theme options -> Shop -> Products list:
1b) Neither Lottie nor Flower demos have shop templates, so if you want to use them you must create it from scratch.
2, 3, 4) The link you have sent does not work:
Also, you did not attach screenshots.
5) For such customization, you should use the Header Builder:
https://support.muffingroup.com/video-tutorials/header-builder-2-0/
Best regards
Please see attached screenshots
New link (2,3,4): https://staging.chaedesign.com/alasamedia/
I will refer to your questions in order you attached screenshots.
1) Go to Betheme -> Theme options -> Accessibility, and disable Keyboard support:
This option to make it work requires adding
overlow: unsetto make images selectable, but it prevents border-radius to work.2) If you mean this space:
It comes from the bottom margin you assigned to the section.
3) I can see that you put that link in the Colum Text element. To trigger a video in the lightbox (popup), you must add
rel="lightbox"to the <a> tag and a link to your video. Like that:Best regards
For #2: There’s a gap between the bottom of the image and the bottom of the blue background. I changed the background color to match the image as a temporary fix, but I need help removing the gap entirely.
For #5. Can you provide the settings to recreate it? How can I build this exact header from the Lottie theme again from scratch (if required)? Is it made with one, two or three columns? Also, on mobile, part of the header drops to a new line. Does fixing this require rebuilding the header, or is there another solution? How do I edit the hamburger menu? How can I adjust the size of logo on sticky menu? If I play around with the headers, will it replace the current one? My fear is I will mess it up and unable to get back the original.
6) Footer issue: On mobile, the button in the footer is aligned to the left, but it should be centered to match the rest of the content. How can I adjust the alignment to fix this?
Thank you!
**Feature suggestion. Allow customizations to a theme header without having to rebuild the header from scratch.
see my reply/questions above...
# 7). If I play around with the headers or product page (building from scratch), will it replace the current one? My fear is I will mess it up and unable to get back the original.
2) I can see that you handled it:
5) Instructions on how to set up a header with Header Builder can be found in our video tutorials:
https://support.muffingroup.com/video-tutorials/header-builder-2-0/
https://support.muffingroup.com/video-tutorials/building-mobile-headers/
https://support.muffingroup.com/video-tutorials/how-to-build-a-header-like-apple-com/
https://support.muffingroup.com/video-tutorials/how-to-activate-sticky-header/
https://support.muffingroup.com/video-tutorials/sidebar-menu-vertical-header-builder/
6) Use this CSS code:
@media only screen and (max-width: 767px){ #block-17 .wp-block-buttons{ justify-content: center; } }Please put it in Betheme -> Theme options -> Custom CSS & JS -> CSS.
7) If you assign conditions, It will replace the current one, but you can always remove the conditions or switch the template to draft.
Best regards
PS.
**Feature suggestion. Allow customizations to a theme header without having to rebuild the header from scratch.
That is what we created Header Builder for, so everyone can adjust the header any way they want. Note that there are pre-built header templates which you can use and base on.
Thank you.
7). How do I switch the template to draft?
8). How do I set a max amount of products to show. For example I only want a max 4 categories showing here. Is there a better way to achieve this? Is there a way to control the size on mobile, the images view tiny?
I have chose gallery (2nd row) and chose "fancy" and they are each image is slightly slanted. I love this! Is this also possible with this feature? or is there a better way to handle this?
7.) Header: I'm attempting to build the same menu, how do you add the shopping cart/account icon to the menu? The hover line turned blue (it was originally changed orange in global options), how do I update the color?
9.) Product Page: How do I change the font size on the product page? How do I bold the price? I changed updated the color to orange but can't find how I did this.
How do I
8) In the element, there is no option to choose the number of categories to show.
But you can use Query Loop for that instead.
https://www.youtube.com/watch?v=maE0FuFIhjQ&list=PLyfUqkbtW2kxq8AY0SivMxX7kf2H9Y-Wf
7a) Add an Icon element and choose its functionality:
7b) You can adjust the animation color in the Menu element under the Style tab:
9) Font sizes are taken from Betheme -> Theme options -> Fonts -> Size & Style.
If you need to adjust only a particular place, a custom CSS might be necessary.
Anyway I can see that your price is already in bold, so I quite do not understand to what you are referring:
Best regards
Thank you.
7). Creating the entire menu from scratch to match the current theme header is too time consuming and bunch of trial and error, since I can't see the dimensions, positions, colors, etc. I can't rebuild it like the original for all three: default/sticky/mobile/slide-menu. I'm going to have to use the original but please help me solve this on the original theme menu... "this" (circled) drops down to the next row.
9). Can you help me with this? It's bold only when there is a sale, as shown in your screenshot, but when its not on sale, it's the font weight of the crossed out section.