308 comments found.
Is there a way to narrow the distance between the navbar and the dropdown element? I feel it’s too low and would love it to be closer to the top navbar. I love your template by the way! Thank you!
Hi,
We appreciate your positive feedback. The dropdown distance varies across different versions of the navbar. Could you please specify which navbar version you’re using? This way we can provide you with tailored instructions. Thank you.
Hi, Do you have an option to set the menu bar on the left hand side instead of on top ?
Hi,
Unfortunately the left menu option is not available in Sandbox.
Hi, is there aravel version for this template?
Hi,
Thank you for your interest in Sandbox. Unfortunately Laravel version is not available.
In Swiper JS, can you please add “watchOverflow” as parameter (data-watchoverflow=”true”) in your next update? This is to remove automatic slide when there is only 1 image
Thank you
Thank you for your suggestion. We will consider adding it.
Why there is no .map CSS & JS files in theme package?
CSS sourcemap is available in the dist version of the template. You can generated them through Gulp. If you have trouble doing this let us know which version of the template you’re using and we’ll provide them for you.
Hi Guys – do you have any plans for updating the HTML version with more design ideas? Many thanks, Nick
Thank you for your interest. We’ve just sent you an email.
When using a swiper slider (example: https://sandbox.elemisthemes.com/docs/elements/carousel.html) it contains the ‘data-margin’ tag. Is there a way to have a different data-margin value for mobile only?
Hi,
Unfortunately you can’t set different margin values for various breakpoints via data attributes. To achieve this you have to change the swiper slider settings in the js/theme.js file.
That is unfortunate because the margin is just right on desktop but too much on mobile. Using css does not work properly as well. Perhaps there is a way to add more data-margin selectors, like data-margin-md , data-margin-lg ?
Thank you
Unfortunately there is no data attribute set for this. You will need to set spaceBetween value for each breakpoint from swiper settings in js/theme.js
Perhaps you could add it, similar to how you done it before with data-duration and data-delay for the counter?
Swiper is more complex than the counter and we lack sufficient expertise in JavaScript to add a margin data attribute along with already existing number of items attribute. We recommend hiring a professional for assistance with this matter.
Hi, I’m trying to change the font family, how do I do that? I’m not using gulp. It seems like it’s not changing. In which css file do I have to change it for the navbar? Thanks
Hi,
Make sure to set the font by adding it to the “—bs-font-sans-serif” variable in style.css :root. This will change the font for the entire website.
:root {
...
--bs-font-sans-serif: FONT NAME;
...
}
To change the font for the navbar specifically, you can achieve this by setting the “font-family” property to the desired font name within ”.navbar” in style.css:
.navbar {
...
font-family: FONT NAME;
}
A question on the navbar, I have added an URL to the top level link, but it is not clickable. Is there a way to make it clickable and follow the entered URL?
https://ibb.co/nmrCKjMHi,
You can make a parent menu clickable following this tip in the documentation: (How to add a link to dropdown parent?) https://sandbox.elemisthemes.com/docs/faq.html#faq-10
Hi,
You can discover all the features of the lightbox plugin included by visiting this link: https://biati-digital.github.io/glightbox/. Unfortunately it appears that the ajax option is not available.
Can you change the order of text and image on the top of demo page 4 to image-text instead of text-image?
div class=”rounded-4-lg-start col-lg-6 order-lg-2 position-lg-absolute top-0 end-0 image-wrapper bg-image bg-cover h-100 min-vh-50” data-image-src=”./assets/img/photos/about16.jpg” style=”background-image: url(”./assets/img/photos/about16.jpg”); user-select: auto !important;”>
Can you move this to the left instead of the right
image is
div class=”rounded-4-lg-start col-lg-8 order-lg-2 position-lg-absolute top-0 end-0 image-wrapper bg-image bg-cover h-100 min-vh-80”
->
div class=”rounded-4-lg-start col-lg-8 order-lg-2 position-lg-absolute top-0 start-0 image-wrapper bg-image bg-cover h-100 min-vh-80”
I think change the “end-0” to “start-0” for the image
How do I send the text to the right?
We’ve sent you an email with the revised code.
In the clients swiper carousel (/docs/blocks/clients.html) when there are only 6 items, it doesn’t loop properly. Dragging it to the left or right does not continuously loop
Please adjust the item count from 7 to a lower number since you currently have 6 items. Displaying 7 items might disrupt the slider’s functionality if you have a lower number of items.
https://sandbox.elemisthemes.com/demo26.html In this template, how can we remove cloud shaped background of the section (<section class="wrapper bg-soft-primary”>) at the top pane of the page?
Hi,
To remove it, simply delete the clouds image located at the end of the section:
<figure><img src="./assets/img/photos/clouds.png" alt="" /></figure>
On this page https://sandbox.elemisthemes.com/services.html there is a counter for “7518 Completed Projects” , “3472 Satisfied Customers” etc.
But is there a way to slow down the speed of the counter so that it count up too fast?
To adjust the speed of the counting animation, modify the counterUp duration in the “js/theme.js” file, specifically on line 654. Increasing the value will result in a slower counting-up effect.
thank you for your quick reply! perhaps an idea to add it in as attribute? data-speed ?
Thank you. Unfortunately currently this option is not available as a data attribute.
Following up on the counter, i want to add the “animate__delay-0s” class to a div above the counter class, but the counter itself already runs regardless of the delay. Is here a way to add a delay to the counter as well?
Certainly. To extend the time before the counter starts, adjust the delay value in the js/theme.js file. Locate line 655, just after the “duration” setting, and increase the delay value.
Ah thank you, is there any way I can set this separately from the theme.js file so that I can still overwrite theme.js with newer versions?
To include these values as data attributes, follow these steps. Initially, modify the ‘counterUp’ duration and delay lines in the ‘js/theme.js’ file like this:
duration: el.getAttribute("data-duration") || 1000,
delay: el.getAttribute("data-delay") || 50
Then you can utilize data attributes in your HTML code like this:
<h3 class="counter mb-1" data-duration="1000" data-delay="50">3472</h3>
Thank you very much! I assume you will add the data-delay in future updates as well then
Certainly, we are considering adding it. Appreciate your suggestion.
or do you have a reference for a vertical slider implementation
Unfortunately the template doesn’t have an example with a vertical slider. The version of the Swiper plugin in the codepen example you shared is older than the one in the template. The issue you’re facing could be because of compatibility problems caused by these version differences. Please try only adding “direction: ‘vertical’,” setting in theme.js to Swiper and step by step going from there.
hi, how to remove unwanted plugin from plugins.js?
Hi,
All third-party plugin JS files are located in src/assets/js/vendor and their CSS files are in src/assets/css/vendor. Just remove unwanted vendor JS / CSS files from vendor folders and then remove unwanted functions from src/assets/js/theme.js and recompile.
If you’re not using Gulp, you can remove unwanted plugins manually from dev/assets/js/plugins.js, dev/assets/js/theme.js and their CSS from dev/assets/css/plugins.css
I send message Support request. This comment can be deleted.
Hi,
We’ve just replied your email.
Hi Guys,
I’m trying to add a non-standard sized video to your demo29, and it’s working well with your responsive embed code, but I can’t seem to get the white, pulsing Play button to sit on top of my inline Vimeo example.
Is it possible you could help? the code I’m using is below. I would like to display this video inline rather than Lightbox. I’m using the responsive embed route, rather than the Vimeo – plyr as it’s a non standard size. Many thanks, Nick
<iframe class=”rounded-4” src=”https://player.vimeo.com/video/895042508?badge=0&autopause=0&player_id=0&app_id=58479” frameborder=”0” allow=”autoplay; fullscreen; picture-in-picture” style=”position:absolute;top:0;left:0;width:100%;height:100%;” title=”Station Road, Selston, Nottingham, Nottinghamshire. NG16 6FF”></iframe> <script src=”https://player.vimeo.com/api/player.js”></script> <!... hopefully you can see all the code – I pasted it all in, but the preview doesn’t show it all.
Could you please provide your URL so we can take a closer look? Thanks.
Hello, I wonder which version of Elementor your theme is compatible with. I want to downgrade back to that elementor version. Because when we use the “convert” option with the current Elementor, corruption occurs and it does not work efficiently. Therefore, I would be very grateful if you could tell me which version of Elementor it is compatible with.
Hello,
This is the html version of the theme, please ask your question here in the wordpress version: https://themeforest.net/item/sandbox-modern-multipurpose-wordpress-theme/41737847
I’m getting this error when I launch Gulp : TypeError: Cannot read properties of undefined (reading ‘indexOf’) at /Users///sandbox340/node_modules/sass/sass.dart.js:98119:12
What version of node are you using?
Not getting any errors with v20.9.0. Which version are you using?
