How do I decrease the size of the slideshow?

Technical Q&A
1

my site is https://atacadaodosobjetos.com/ the site password is brian

the slide size for pc is too big and i would like to decrease the slide size

the slide code is this:

Show More

{% if section.blocks.size > 0 %}

{% assign- autoplay = section.settings.autoplay -%}
{% assign- autoplaySpeed = section.settings.slideshow_speed -%}
{% assign- fade = section.settings.slideshow_transition -%}
{% assign- dots = section.settings.dots -%}

{% endif %}

{% schema %}
{
“name”: “Slideshow”,
“class”: “home-slideshow-sections”,
“max_blocks”: 10,
“settings”: [
{
“type”: “select”,
“id”: “layout”,
“label”: “Slideshow Layout:”,
“options”: [
{
“value”: “default”,
“label”: “Default”
},
{
“value”: “padd_60”,
“label”: “Boxed”
},
{
“value”: “full”,
“label”: “Full Width”
}
],
“default”: “full”
},
{
“type”: “header”,
“content”: “Margin Bottom:”
},
{
“type”: “range”,
“id”: “margin_bottom_mb”,
“label”: “Mobile”,
“min”: 0,
“max”: 100,
“step”: 1,
“default”: 20
},
{
“type”: “range”,
“id”: “margin_bottom_tab”,
“label”: “Tablet”,
“min”: 0,
“max”: 100,
“step”: 1,
“default”: 20
},
{
“type”: “range”,
“id”: “margin_bottom”,
“label”: “Desktop”,
“min”: 0,
“max”: 100,
“step”: 1,
“default”: 30
},
{
“type”: “header”,
“content”: “Settings for Slideshow”
},
{
“type”: “select”,
“id”: “style_slideshow”,
“label”: “Style Slideshow”,
“default”: “style_1”,
“options”: [
{
“value”: “style_1”,
“label”: “Style 1”
},
{
“value”: “style_2”,
“label”: “Style 2”
}
]
},
{
“type”: “checkbox”,
“id”: “autoplay”,
“label”: “Slideshow Auto Play”,
“default”: true
},
{
“type”: “select”,
“id”: “slideshow_speed”,
“label”: “Change slides every”,

“options”: [
{ “value”: “5000”, “label”: “5 seconds” },
{ “value”: “6000”, “label”: “6 seconds” },
{ “value”: “7000”, “label”: “7 seconds” },
{ “value”: “8000”, “label”: “8 seconds” },
{ “value”: “9000”, “label”: “9 seconds” },
{ “value”: “10000”, “label”: “10 seconds” }
],
“default”: “5000”
},
{
“type”: “select”,
“id”: “slideshow_transition”,
“label”: “Slideshow transition effect”,
“options”: [
{
“value”: “false”,
“label”: “Slide”
},
{
“value”: “true”,
“label”: “Fade”
}
],
“default”: “true”
},
{
“type” : “radio”,
“id” : “dots”,
“label” : “Show Dots for Slideshow (Desktop)”,
“options”: [
{
“value”: “true”,
“label”: “True”
},
{
“value”: “false”,
“label”: “False”
}
],
“default”: “true”
},
{
“type”: “color”,
“id”: “dots_color”,
“label”: “Dots color”,
“default”: “#707979”,
“info”: “Default Value: #707979”
},
{
“type”: “color”,
“id”: “dots_active_color”,
“label”: “Dots Active color”,
“default”: “#505656”,
“info”: “Default Value: #505656”
},
{
“type”: “checkbox”,
“id”: “dots_opacity”,
“label”: “Dots Opacity (80%)”,
“default”: false
},
{
“type”: “color”,
“id”: “bg_dots_color”,
“label”: “Dots Background Style 2”,
“default”: “#bababa”,
“info”: “=======================”
},
{
“type”: “checkbox”,
“id”: “arrow_active”,
“label”: “Show Arrow for Slideshow (Desktop)”,
“default”: true
},
{
“type”: “color”,
“id”: “arrow_color”,
“label”: “Arrow color”,
“default”: “#666d6d”,
“info”: “Default Value: #666d6d”
},
{
“type”: “color”,
“id”: “arrow_border_color”,
“label”: “Arrow Border color”,
“default”: “#666d6d”,
“info”: “Default Value: #666d6d”
},
{
“type”: “color”,
“id”: “arrow_bg_color”,
“label”: “Arrow background color”,
“default”: “#fff”,
“info”: “Default Value: #fff”
},
{
“type” : “text”,
“id” : “position_slick_arrow”,
“label” : “Position Arrow - Unit % or px”,
“default” : “10%”
},
{
“type” : “text”,
“id” : “min_width_banner_button”,
“label” : “Banner Button Width”,
“info”: “Ex: 270px”
},
{
“type”: “header”,
“content”: “Settings for Video”
},
{
“type” : “color”,
“id” : “bg_video”,
“label” : “Background Color video”,
“default” : “#866965”
},
{
“type”: “range”,
“id”: “bg_overlay_opacity”,
“label”:“Opacity”,
“min”: 0,
“max”: 100,
“step”: 1,
“unit”: “%”,
“default”: 40
},
{
“type”: “text”,
“id”: “video_height”,
“label”: “Slideshow Video Height”,
“default”: “41.7%”,
“info”: “You can adjust the height of video to be fit with slider image by %. Example: 30%, 47.25%, 51%.”
},
{
“type”: “checkbox”,
“id”: “auto_playvideo”,
“label”: “Autoplay video”,
“default”: true
}
],

“blocks” : [
{
“type”: “image”,
“name”: “Image SlideShow”,
“settings”:[
{
“type”: “checkbox”,
“id”: “dpl_slide_img”,
“label” : “Enable”,
“default” : true
},
{
“type”: “image_picker”,
“id”: “image_slide”,
“label” : “Select Image”,
“info”: “Recommended Image: Width x Height (1880 x 720)px”
},
{
“type”: “image_picker”,
“id”: “image_slide_mb”,
“label” : “Select Image Mobile”,
“info”: “Recommended Image: Width x Height (450 x 300)px”
},
{
“type”: “header”,
“content”: “Slideshow Layout”,
“info” : “=======================”
},
{
“type”: “select”,
“id”: “style_content”,
“label”: “Style Content”,
“default”: “style_1”,
“options”: [
{
“value”: “style_1”,
“label”: “Style 1”
},
{
“value”: “style_2”,
“label”: “Style 2”
}
]
},
{
“type”: “select”,
“id”: “alignment”,
“label”: “Position Content”,
“default”: “left”,
“options”: [
{
“value”: “left”,
“label”: “Left”
},
{
“value”: “center”,
“label”: “Center”
},
{
“value”: “right”,
“label”: “Right”
}
]
},
{
“type”: “select”,
“id”: “text_alignment”,
“label”: “Text alignment”,
“default”: “center”,
“options”: [
{
“value”: “left”,
“label”: “Left”
},
{
“value”: “center”,
“label”: “Center”
},
{
“value”: “right”,
“label”: “Right”
}
]
},
{
“type” : “color”,
“id” : “bg_color_box”,
“label” : “Background Color Content Style 2”,
“default” : “#ffffff”
},
{
“type” : “color”,
“id” : “color_border_box”,
“label” : “Background Border Content Style 2”,
“default” : “#bcbcbc”
},
{
“type”: “header”,
“content”: “Slideshow Content”,
“info” : “=======================”
},
{
“type” : “text”,
“id” : “heading”,
“label” : “Heading”,
“default” : “Cosmopolis”
},
{
“type” : “text”,
“id” : “font_size_heading”,
“label” : "Heading Font Size ",
“default” : “40px”
},
{
“type” : “color”,
“id” : “color_heading”,
“label” : “Heading Color”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “color_heading_mb”,
“label” : “Heading Color Mobile”,
“default” : “#fff”
},
{
“type” : “text”,
“id” : “sub_heading”,
“label” : “Sub Heading”
},
{
“type” : “text”,
“id” : “font_size_sub_heading”,
“label” : "Sub Heading Font Size ",
“default” : “30px”
},
{
“type” : “color”,
“id” : “color_sub_heading”,
“label” : “Sub Heading Color”,
“default” : “#fff”
},
{
“type” : “color”,
“id” : “color_sub_heading_mb”,
“label” : “Sub Heading Color Mobile”,
“default” : “#fff”
},
{
“type” : “textarea”,
“id” : “slide-des”,
“label” : “Slide Description”,
“default”: “Quisquemos sodales suscipit tortor ditaemcos condimentum de cosmo lacus meleifend menean diverra loremous.”
},
{
“type” : “text”,
“id” : “font_size_des”,
“label” : “Description Font Size”,
“default” : “12px”
},
{
“type” : “color”,
“id” : “color_des”,
“label” : “Description Color”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “color_des_mb”,
“label” : “Description Color mobile”,
“default” : “#fff”
},
{
“type” : “text”,
“id” : “button_slide”,
“label” : “Button Slideshow”,
“default” : “Shop The Collection”
},
{
“type” : “url”,
“id” : “link”,
“label” : “Slide link”
},
{
“type” : “color”,
“id” : “bg_button”,
“label” : “Background Button”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “border_button”,
“label” : “Border Button”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “color_button”,
“label” : “Button Color”,
“default” : “#fff”
},
{
“type” : “color”,
“id” : “bg_button_mb”,
“label” : “Background Button Mobile”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “border_button_mb”,
“label” : “Border Button Mobile”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “color_button_mb”,
“label” : “Button Color Mobile”,
“default” : “#fff”
},
{
“type”: “header”,
“content”: “Slideshow width Lookbook”,
“info” : “=======================”
},
{
“type” : “header”,
“content” : “Product 1”
},
{
“type” : “product”,
“id” : “lb_product_1”,
“label” : “Select Product”
},
{
“type” : “text”,
“id” : “top_position_1”,
“label” : “Top Position”,
“default” : “10”,
“info” : “Unit %”
},
{
“type” : “text”,
“id” : “left_position_1”,
“label” : “Left Position”,
“default” : “10”,
“info” : “Unit %”
},
{
“type” : “color”,
“id” : “dots_color_1”,
“label” : “Select Icon Color”,
“default” : “#fff”
},
{
“type” : “color”,
“id” : “dots_bg_color_1”,
“label” : “Select Icon Background color”,
“default” : “#323232”
},
{
“type” : “color”,
“id” : “dots_shadow_color_1”,
“label” : “Select Icon Shadow Color”,
“default” : “#fff”,
“info” : “=======================”
},

{
“type” : “header”,
“content” : “Product 2”
},
{
“type” : “product”,
“id” : “lb_product_2”,
“label” : “Select Product”
},
{
“type” : “text”,
“id” : “top_position_2”,
“label” : “Top Position”,
“default” : “10”,
“info” : “Unit %”
},
{
“type” : “text”,
“id” : “left_position_2”,
“label” : “Left Position”,
“default” : “10”,
“info” : “Unit %”
},
{
“type” : “color”,
“id” : “dots_color_2”,
“label” : “Select Icon Color”,
“default” : “#fff”
},
{
“type” : “color”,
“id” : “dots_bg_color_2”,
“label” : “Select Icon Background color”,
“default” : “#323232”
},
{
“type” : “color”,
“id” : “dots_shadow_color_2”,
“label” : “Select Icon Shadow Color”,
“default” : “#fff”,
“info” : “=======================”
},

{
“type” : “header”,
“content” : “Product 3”
},
{
“type” : “product”,
“id” : “lb_product_3”,
“label” : “Select Product”
},
{
“type” : “text”,
“id” : “top_position_3”,
“label” : “Top Position”,
“default” : “10”,
“info” : “Unit %”
},
{
“type” : “text”,
“id” : “left_position_3”,
“label” : “Left Position”,
“default” : “10”,
“info” : “Unit %”
},
{
“type” : “color”,
“id” : “dots_color_3”,
“label” : “Select Icon Color”,
“default” : “#fff”
},
{
“type” : “color”,
“id” : “dots_bg_color_3”,
“label” : “Select Icon Background color”,
“default” : “#323232”
},
{
“type” : “color”,
“id” : “dots_shadow_color_3”,
“label” : “Select Icon Shadow Color”,
“default” : “#fff”,
“info” : “=======================”
}
]
},
{
“type”: “video”,
“name”: “Video Slider”,
“settings”: [
{
“type”: “checkbox”,
“id”: “dpl_slide_img”,
“label” : “Enable”,
“default” : true
},
{
“type” : “radio”,
“id” : “style_video”,
“label” : “Style Video”,
“options”: [
{
“value”: “youtube”,
“label”: “Youtube”
},
{
“value”: “mp4”,
“label”: “Mp4”
}
],
“default”: “youtube”
},
{
“type”: “header”,
“content”: “Youtube”
},
{
“type”: “text”,
“id”: “video_link”,
“label”: “YouTube video ID”,
“default”: “eTCtDW7O1aM”,
“info”: “Find your YouTube video ID.”
},
{
“type”: “header”,
“content”: “MP4”
},
{
“type”: “text”,
“id”: “video_mp4_link”,
“label”: “Video link”
},
{
“type”: “header”,
“content”: “Slideshow Content”,
“info” : “Use for MP4 Video”
},
{
“type”: “select”,
“id”: “alignment”,
“label”: “Text alignment”,
“default”: “left”,
“options”: [
{
“value”: “left”,
“label”: “Left”
},
{
“value”: “center”,
“label”: “Center”
},
{
“value”: “right”,
“label”: “Right”
}
]
},
{
“type” : “text”,
“id” : “heading”,
“label” : “Heading”,
“default” : “Cosmopolis”
},
{
“type” : “text”,
“id” : “font_size_heading”,
“label” : "Heading Font Size ",
“default” : “40px”
},
{
“type” : “color”,
“id” : “color_heading”,
“label” : “Heading Color”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “color_heading_mb”,
“label” : “Heading Color Mobile”,
“default” : “#fff”
},
{
“type” : “textarea”,
“id” : “slide-des”,
“label” : “Slide Description”,
“default”: “Quisquemos sodales suscipit tortor ditaemcos condimentum de cosmo lacus meleifend menean diverra loremous.”
},
{
“type” : “text”,
“id” : “font_size_des”,
“label” : “Description Font Size”,
“default” : “12px”
},
{
“type” : “color”,
“id” : “color_des”,
“label” : “Description Color”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “color_des_mb”,
“label” : “Description Color Mobile”,
“default” : “#fff”
},
{
“type” : “text”,
“id” : “button_slide”,
“label” : “Button Slideshow”,
“default” : “Shop The Collection”
},
{
“type” : “url”,
“id” : “link”,
“label” : “Slide link”
},
{
“type” : “color”,
“id” : “bg_button”,
“label” : “Background Button”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “border_button”,
“label” : “Border Button”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “color_button”,
“label” : “Button Color”,
“default” : “#fff”
},
{
“type” : “color”,
“id” : “bg_button_mb”,
“label” : “Background Button Mobile”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “border_button_mb”,
“label” : “Border Button Mobile”,
“default” : “#232323”
},
{
“type” : “color”,
“id” : “color_button_mb”,
“label” : “Button Color Mobile”,
“default” : “#fff”
}
]
}
],
“presets”: [{
“name”: “Slideshow”,
“category”: “Slideshow”,
“blocks”: [
{
“type”: “image”
}
]
}]
}
{% endschema %}

2

Hey, @Brianmonteiro54

Have you tried adjusting your slideshow layout from your theme editor? You can change it from full-width to default which will lower the height of the slideshow:

If there is anything else I can help you with, please let me know.

3

Yes, but in the theme editor there is no way to reduce it the way I would like, then it is necessary to be directly in the code

4

@Brianmonteiro54

This is not the best way to solve this, but in your current case it’s the easiest way.

  1. In your Shopify Admin go to: online store > themes > actions > edit code
  2. Find Asset > theme.min.css and paste this at the bottom of the file:
@media (min-width: 749px){
.home-slideshow-sections{
transform: scale(0.8) !important;
margin-top: -21px !important;
margin-bottom: -20px !important;
}
}

You can control the values as per your wish.

0.8 = the size of the image
-21px = top spacing, can be either positive or negative
-20px = bottom spacing, can be either positive or negative

It will affect only desktop and larger devices, mobile will remain the same.

Additionally, since you’re using just one single image and not a slideshow, this custom section may be useful to you.

Please let me know whether it works.

Kind regards,
Diego