- What would be the best way to have two variants of the theme? I'd like to have a button that would switch the colors of the theme (one in black and white, and one with vibrant colors). Is there an "easy" way?
- There's an animated icon for the scroll on the Demo theme but I don't know how to replicate it on my theme (I haven't used the template). Can you tell me what kind of element is it? (That would be great if there's also one like an animated play button in the library)
Thanks for your great products and have a nice day
1— Sorry but that is not an option that our theme offers.
If you're looking for professional help in this matter, there's always someone available for such tasks on the WP Kraken or Codeable. Pricing and timeline are always straightforward there and that's the main reason for recommending those services.
2— Can you please try to be very specific about the question and explain it more to us, if you can please send us a screenshot of this element so in this way we can easily understand you and give you the proper answer.
Thanks for the answer, I'm talking about the scrolling mouse icon (cf. attached picture), when you click it, it will smoothly scroll to the next section. Also, how to you define anchors on sections? (For example, if I want to click a button and be sent to a specific section of the page and not at the very top)
1— That animated mouse icon is available for the Revolution Slider slider, if you have slider in your homepage and you want to achieve that then please do this (see video).
Can you please try to be very specific about the question and explain it more to us, in this way we can easily understand you and give you the proper answer.
Please send me a screenshot of the area that you are talking about and also the URL of that page.
Sure, in the attachment, you can see that the title PORTFOLIO is touching the top of the screen. That's the result when I click on the anchor link. I need some space between the top of the screen and the title for aesthetic reasons.
EDIT: the only solution I found is to add a lot of margin-top but it's a different issue then cause the gap between the two sections is way too big.
Thanks but like I said, if I put a margin or a padding, it creates a big blank gap not really aesthetic... It works in a way but I need is a way to move the anchor higher without effecting the text. So if possible, I'd like to not add this space before the title. Thanks
Hi,
I have two questions:
- What would be the best way to have two variants of the theme? I'd like to have a button that would switch the colors of the theme (one in black and white, and one with vibrant colors). Is there an "easy" way?
- There's an animated icon for the scroll on the Demo theme but I don't know how to replicate it on my theme (I haven't used the template). Can you tell me what kind of element is it? (That would be great if there's also one like an animated play button in the library)
Thanks for your great products and have a nice day
Hi lycosxy,
1— Sorry but that is not an option that our theme offers.
If you're looking for professional help in this matter, there's always someone available for such tasks on the WP Kraken or Codeable. Pricing and timeline are always straightforward there and that's the main reason for recommending those services.
2— Can you please try to be very specific about the question and explain it more to us, if you can please send us a screenshot of this element so in this way we can easily understand you and give you the proper answer.
Thanks!
Thanks for the answer, I'm talking about the scrolling mouse icon (cf. attached picture), when you click it, it will smoothly scroll to the next section. Also, how to you define anchors on sections? (For example, if I want to click a button and be sent to a specific section of the page and not at the very top)
Hi lycosxy,
1— That animated mouse icon is available for the Revolution Slider slider, if you have slider in your homepage and you want to achieve that then please do this (see video).
Here is the Slider CSS code:
.mouse {border: 2px solid #FFFFFF;
border-radius: 26px;
position: absolute;
top: 50%;
left: 50%;
width: 26px;
height: 42px;
-webkit-backface-visibility: hidden;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
cursor: pointer;
}
.mouse:after {
background-color: #ffffff;
border-radius: 100%;
content: "";
position: absolute;
top: 5px;
left: 50%;
margin-left: -2px;
width: 4px;
height: 4px;
opacity: 1;
-webkit-transform: translateY(0px) scaleY(1) scaleX(1) translateZ(0px);
transform: translateY(0px) scaleY(1) scaleX(1) translateZ(0px);
-webkit-animation: scroll 1.5s -1s cubic-bezier(0.680, -0.550, 0.265, 1.550) infinite;
animation: scroll 1.5s -1s cubic-bezier(0.680, -0.550, 0.265, 1.550) infinite;
}
lesshat-selector {
-lh-property: 0; }
@-webkit-keyframes scroll{ 0%, 20% { -webkit-transform: translateY(0px) scaleY(1) scaleX(1) translateZ(0px); } 10% { -webkit-transform: translateY(0px) scaleY(1.2) scaleX(1.2) translateZ(0px); opacity: 1; } 100% { -webkit-transform: translateY(20px) scaleY(2.5) scaleX(0.5) translateZ(0px); opacity: 0.01; }}
@keyframes scroll{ 0%, 20% {-webkit-transform: translateY(0px) scaleY(1) scaleX(1) translateZ(0px);-ms-transform: translateY(0px) scaleY(1) scaleX(1) translateZ(0px);transform: translateY(0px) scaleY(1) scaleX(1) translateZ(0px); } 10% {-webkit-transform: translateY(0px) scaleY(1.2) scaleX(1.2) translateZ(0px);-ms-transform: translateY(0px) scaleY(1.2) scaleX(1.2) translateZ(0px);transform: translateY(0px) scaleY(1.2) scaleX(1.2) translateZ(0px); opacity: 1; } 100% {-webkit-transform: translateY(20px) scaleY(2.5) scaleX(0.5) translateZ(0px);-ms-transform: translateY(20px) scaleY(2.5) scaleX(0.5) translateZ(0px);transform: translateY(20px) scaleY(2.5) scaleX(0.5) translateZ(0px); opacity: 0.01; };
}
2— Please read Scrollable menu links article.
Have a nice weekend!
Thanks a lot, have a nice weekend too
Hi lycosxym,
Thank you very much, glad to hear that I helped
P.S: If you like the theme, it would help us a lot if you could give us a five-star rating on Themeforest from your Downloads tab.
A huge thank you from me and Laborator in advance <3
Hi,
How can I offset an anchor?
My anchor works but the text is literally next to the top of the screen and on mobile, the logo is on the title.
I need to offset the displacement by like 100px on the Y axis.
Thanks
P.S : I rated the theme on Themeforest ;)
Hi lycosxy
Can you please try to be very specific about the question and explain it more to us, in this way we can easily understand you and give you the proper answer.
Please send me a screenshot of the area that you are talking about and also the URL of that page.
Thank you very much!
Thanks.
Sure, in the attachment, you can see that the title PORTFOLIO is touching the top of the screen. That's the result when I click on the anchor link. I need some space between the top of the screen and the title for aesthetic reasons.
EDIT: the only solution I found is to add a lot of margin-top but it's a different issue then cause the gap between the two sections is way too big.
Hi,
You just need to add a padding-top to the next element (see our example).
Have a nice day!
Thanks but like I said, if I put a margin or a padding, it creates a big blank gap not really aesthetic... It works in a way but I need is a way to move the anchor higher without effecting the text. So if possible, I'd like to not add this space before the title. Thanks
Hi lycosxy,
Sorry but there is not any other solution, as you wrote you can just add a bit padding in those sections.
Thanks for your understanding!