Banner image
Showing a full image
- Size > Cover
Showing only a part of an image
- Size > Auto
Rolling image as you scroll
- Style > Background
- Attachment > Fixed >
- Repeat > No repeat
- Size > Cover
Button
- Advanced > Border Radius > 5, 5, 5, 5
Corner (rounded)
Changing its shape
- Border radius
- 0 = right angle, 10 = round, 20 = more round
Changing inner margins
- Edit button > Style > Padding
FAQ
How to create FAQ
- Accordion
How to keep all answers closed at the start
- Elementor page > select HTML > insert it right above FAQ (Accordion) > copy & paste the below code
<style class="accordion-closed-on-load">
body:not(.elementor-editor-active) .elementor-widget-accordion .elementor-tab-content {
display: none!important;
}
</style>
<script>
window.addEventListener('load', function() {
setTimeout(function(){
document.querySelector('.accordion-closed-on-load').remove();
let accordionsElems = document.querySelectorAll('.elementor-widget-accordion')
accordionsElems.forEach(e => {
let activeTitle = e.querySelector('.elementor-tab-title.elementor-active');
let activeContent = e.querySelector('.elementor-tab-content.elementor-active')
jQuery(activeContent).hide();
activeTitle.classList.remove('elementor-active');
activeContent.classList.remove('elementor-active');
activeContent.setAttribute('hidden','hidden');
activeTitle.setAttribute('aria-expanded',false);
activeTitle.setAttribute('aria-selected',false);
activeTitle.setAttribute('tabindex',-1);
});
},100);
});
</script> Filterable gallery (Addons for Elementor)
Changing from one image to another
- Additional Options > Autoplay speed
- 2000 is faster than 5000
Transitioning from one image to another
- Additional Options > Animated speed
- 200 is faster than 500
Smooth looping from last image back to first
- Additional Options > Indefinite loop
- choose YES
Image rolling in
- Effect > Slide or Fade
Filling up the entire column
- Image Carousel > Slide to show: 1
Enlarging an image with a click
- Image Carousel > Link > Media file
Image Size
Fix height or width of image
- edit container > layout > width / min height
Image carousel
Changing from one image to another
- Additional Options > Autoplay speed
- 2000 is faster than 5000
Transitioning from one image to another
- Additional Options > Animated speed
- 200 is faster than 500
Smooth looping from last image back to first
- Additional Options > Indefinite loop
- choose YES
Image rolling in
- Effect > Slide or Fade
Filling up the entire column
- Image Carousel > Slide to show: 1
Enlarging an image with a click
- Image Carousel > Link > Media file
Inner section missing (it's gone forever)
- put all images in a container top to bottom > go to layout > direction > row
Inner section - how to show right column before left column in mobile version
- how to show image before text / text before image / left on top / right on top
- select section (not column) > advanced > responsive > reverse column (mobile)
Shadow
- Advanced > Border
- Border Radius
- 5, 5, 5, 5
- Box shadow
- horizontal: 0
- vertical: 20
- blur: 28
- spread: 0
- position: outline
- for containers, border is found under “Style” not “Advanced”
Transparent header
Change top menu color
- customize > header > search / trigger > transparent state
