-
-
Hi,
I saw, that the the has an integrated “back to top button” function without the neccessity of a plugin.
So I want to deactivate the current “back to top plugin” on my site http://www.multra-gmbh.com
and activate the “theme function for back to top”.Is the following css code right to activate the desired funktion within the theme?
.scrollup {
z-index: 9999;
display: block !important;
}And how can I change the color of the integrated button as well as have an “up-arrow” symbol?
Many thanks for your support in advance!
-
Hello,
Yes, that code is ok. To change the color of the button and arrow, add this code:
.scrollup { background-color: rgba(34,34,34,0.6); background-image: url('img/icon_top.png'); }
Change the color and transparency to you wish.
Best regards!
-
Hello,
I tried to add the custom CSS code under general settings but it doesnt seem to work an receive the following errors:
– use of !important
– fallback background-color (hex or RGB) should precede RGBA background-color.
I have passed it in as follows:
scrollup {
z-index: 9999;
display: block !important;
}
.scrollup { background-color: rgba(34,34,34,0.6);
background-image: url(‘img/icon_top.png’);
}
Would I need to do something different for my layout?
Many thanks
-
Hi Mihaila,
1. The change of color does not work…
I neete the button to be color:#c7cdfc
And the arrow should be: plaine white2. The button should fade in as soon as the user scrolls down.
It should not apperar from the beginning as it is now at http://www.multra-gmbh.comThe current code is:
.scrollup {
z-index: 9999;
display: block !important;
background-color: rgba(199, 205, 252, 1);
background-image: url(‘img/icon_top.png’);
}
Many thanks!
-
Hello,
You have pasted the code wrong. The first code should have a dot at the beginning:
.scrollup { z-index: 9999; display: block !important; }
This will display the ‘back to top’ button in your site. (screenshot).
The second block of code:.scrollup { background-color: rgba(199, 205, 252, 1); background-image: url(‘img/icon_top.png’); }
contains the attributes that are responsible for the button color/transparency and arrow image. If you want to change them, edit the values of these attributes.
Best regards!
-
Hello,
-the use of ‘!important’ is a notice, but it represents no issue in the code.
-To change the background color just edit the second css code to this:
.scrollup { background-color: #c7cdfc !important; }
-The arrow is an image. To change it, edit the image source url to the one you want to use. (this attribute: background-image: url(‘img/icon_top.png’);)-By default the button position is the beginning and does not fade. I will suggest this edit to the developer team to include in the next update. Sorry but this is a customization not included in this support.
Best regards!
-
Is it possible to amend code so it only displays once the user has scrolled down the page a little?
-
Hello,
As previously mentioned, the button position in default layout is the beginning and does not fade. You can change that with css but you have to do it yourself as this is a customization not included in this support.
Best regards!
-
You must be logged in to reply to this topic.