Alot Of Specific Questions
Hello!
I am pretty new to html/css, and using betheme. I really like it, but there are some options I'd love to customize that currently are not a part of the betheme options. Bear with me, there are a lot of things I am trying to achieve but just don't know how. If you could answer all of them that'd be great! If not, wherever you can offer help would be appreciated.
1. Header Bar
Currently I am using the "Transparent" header preset.
The following images show what my desired end result is
2. Scroll Effect / Speed
I found the scroll effects in the settings, but I want to adjust the scroll speed of the website. I am sure this is buried somewhere in the themes code I just don't know where to find it. I also like the smooth scroll effect, but I don't like the acceleration of it. Also, I wonder if it is possible to incorporate scroll effect animations like shown in this demo: https://ihatetomatoes.net/demos/one-page-scroll-animations/
3. Custom Image Hover effects
Is this possible? I tried to add a custom css and then assign the class to one of my images but all of the settings are already dictated by the muffin builder image settings that it ended up just taking the image completely out of my page.
My desired effect is a Title, caption with a short description, and a button with a color fade from left to right with a link to the page where the portfolio item is located. I can imagine this would be easy if I could input the image using html rather than the muffin builder, but that would mess up my whole layout, as I am not knowledgeable enough to get my tiled portfolio lay out like I can with the muffin builder.
You can see an example of what I want here:
3. Button Effects
Is it possible to assign the above effect to all buttons on the website?
I am assuming I would possibly just create custom css on the page with the desired button hover effect, and then assign that class to the button with the muffin builder, but I am not sure
4. Progress Bars
5. Tiled elements
Is it at all possible to arrange elements like this :
I want to be able to have progress bars on the left side, and two separate square elements on the right side, most likely columns / formatted text
Comments
1. You can change menu items color easily under Theme options > Colors > Menu & Action Bar section. But please note custom colors would be taken into account only if you set CUSTOM skin. But to align menu items to the right, please go to Theme options > Menu & Action Bar > Menu section where the right option to do this is.
To change sticky header opacity, it is necessary to use custom css but we need link to site where you would like to do this first.
2. The only place where you can change scroll speed is Theme options > Addons & Plugins > Addons section but if it's not what you are looking for, then we do not have any other solution. And of course we do not have same scroll as you presented above.
3. This requires files customization what in reference to Item Support Policy is not allowed. So if you want to modify files and don't know how, you should contact with your web developer.
4. To make progress bars solid color, you need to use the following css to remove background:
.progress_bars .bars_list li .bar .progress { background-image: none !important; }To center them on page with 1/2, you can put them into 1/2 Column item and 2 x 1/4 Placeholder items on side. However, we do not have an option to set up class names for certain bars.5. To arrange elements like this, you need to put them in 2 different wraps.
.sticky-dark #Top_bar.is-sticky {background: rgba(0,0,0,0.5) !important;
}