Shopify themes, liquid, logos, and UX
When I post the Youtube Link on my slideshow button, it opens the link in the same window (and takes you off my website). I would like the link to open in an external window.
www.NardosNaturalPrivateLabel.com you will see a PLAY VIDEO button on the middle of the page.
Solved! Go to the solution
This is an accepted solution.
@nardosnatural, do this to fix it in 20 seconds:
1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:
<script>
function openYoutubeOnNewPage(){
var $buttons = document.querySelectorAll(`.slideshow__text-content [href*='youtube']`);
if (!$buttons){
return;
}
for (var each of $buttons){
each.setAttribute("target", "_blank");
}
}
openYoutubeOnNewPage();
</script>
Kind regards,
Diego
Please share your sections/slideshow.liquid file code .
Thanks!
{%- if section.settings.slideshow_height == 'adapt' -%}
{% comment %}
'min_aspect_ratio' is the minimum aspect ratio of images shown without
whitespace when 'slideshow_height' is set to 'adapt'.
The aspect ratio values for the first image in the slideshow will be used
unless it is blank, in that case a ratio of 2:1 will be used.
{% endcomment %}
{%- assign first_block = section.blocks[0] -%}
{%- if first_block.settings.image.aspect_ratio == blank -%}
{%- assign min_aspect_ratio = 2.0 -%}
{%- else -%}
{%- assign min_aspect_ratio = first_block.settings.image.aspect_ratio -%}
{%- endif -%}
{% assign wrapper_height = 100 | divided_by: min_aspect_ratio %}
{%- endif -%}
{%- assign text_alignments = section.settings.text_alignment | split: ' ' -%}
{%- assign text_horizontal_alignment = text_alignments.first -%}
{%- assign text_vertical_alignment = text_alignments.last | strip -%}
<div data-section-id="{{ section.id }}" data-section-type="slideshow-section">
{%- if section.blocks.size > 0 -%}
<div id="SlideshowWrapper-{{ section.id }}" class="slideshow-wrapper" role="region" aria-label="slideshow" aria-describedby="slideshow-info" tabindex="-1" data-slider>
<div class="slideshow slideshow--{{ section.settings.slideshow_height }}{% if display_controls %} slideshow--display-controls{% endif %}"
id="Slideshow-{{ section.id }}"
data-autorotate="{{ section.settings.autorotate }}"
data-slider-container
data-speed="{{ section.settings.autorotate_speed | times: 1000 }}"
data-adapt-height="{% if section.settings.slideshow_height == 'adapt' %}true{% else %}false{% endif %}"
data-slide-nav-a11y="{{ 'sections.slideshow.load_slide' | t: slide_number: '[slide_number]' }}"
{% if section.settings.slideshow_height == 'adapt' %}data-min-aspect-ratio="{{ min_aspect_ratio }}"
style="height: {{- wrapper_height -}}vw"{% endif %}>
{%- for block in section.blocks -%}
{%- assign block_image = block.settings.image -%}
<div id="slickSlide-{{ block.id }}" class="slideshow__slide slideshow__slide--{{ block.id }}{% if forloop.first %} slideshow__slide--active{% endif %}" data-slider-slide-index="{{ forloop.index0 }}" data-slider-item {{ block.shopify_attributes }}>
{% if block_image == blank %}
<div class="slideshow__image js">
<div class="placeholder-background">
{% capture current %}{% cycle 1, 2 %}{% endcapture %}
{{ 'lifestyle-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
</div>
{% if section.settings.show_overlay %}<div class="slideshow__overlay"></div>{% endif %}
</div>
{% else %}
<div
{% unless block_image.alt == blank %}
role="img"
aria-label="{{ block_image.alt | escape }}"
data-alt="{{ block_image.alt | escape }}"
{% endunless %}
class="slideshow__image box ratio-container lazyload{% unless forloop.first %} lazypreload{% endunless %} js"
data-bg="{{ block_image | img_url: '300x300' }}"
data-bgset="{% include 'bgset', image: block_image %}"
data-sizes="auto"
data-parent-fit="contain"
style="background-position: {{ block.settings.alignment }};"
data-image-loading-animation>
{% if section.settings.show_overlay %}<div class="slideshow__overlay"></div>{% endif %}
</div>
{% endif %}
<noscript>
<div class="slideshow__image"{% if block_image %}{% unless block_image.alt == blank %} role="img" aria-label="{{ block_image.alt | escape }}"{% endunless %} style="background-image: url('{{ block_image | img_url: '2048x' }}'); background-position: {{ block.settings.alignment }};"{% endif %}>
{% if block_image == blank %}
<div class="placeholder-background">
{{ 'lifestyle-1' | placeholder_svg_tag: 'placeholder-svg' }}
</div>
{% endif %}
</div>
</noscript>
<div class="slideshow__text-wrap slideshow__text-wrap--desktop">
<div class="slideshow__text-content slideshow__text-content--vertical-{{ text_vertical_alignment }} text-{{ text_horizontal_alignment }}">
<div class="page-width">
{% unless block.settings.slide_title == blank and block.settings.subheading == blank %}
<ul class="slideshow__text-content-list">
{%- unless block.settings.slide_title == blank -%}
<li>
<h2 class="h1 mega-title slideshow__title{% if section.settings.text_size == 'large' %} mega-title--large{% endif %}">
{{ block.settings.slide_title | escape }}
</h2>
</li>
{%- endunless -%}
{%- unless block.settings.subheading == blank -%}
<li>
<span class="mega-subtitle slideshow__subtitle{% if section.settings.text_size == 'large' %} mega-subtitle--large{% endif %}">
{{ block.settings.subheading | escape }}
</span>
</li>
{%- endunless -%}
</ul>
{% endunless %}
{%- assign show_link_button = false -%}
{%- if block.settings.button_label != blank and block.settings.button_link != blank -%}
{%- assign show_link_button = true -%}
{%- endif -%}
{%- if show_link_button -%}
<div class="slideshow__btn-wrapper{% if block.settings.slide_title != blank or block.settings.subheading != blank %} slideshow__btn-wrapper--push{% endif %}">
<a href="{{ block.settings.button_link }}" class="btn slideshow__btn">
{{ block.settings.button_label | escape }}
</a>
</div>
{%- endif -%}
</div>
</div>
</div>
</div>
{%- endfor -%}
</div>
<div class="slideshow__controls">
{%- if section.blocks.size > 1 -%}
{%- assign arrows_width = section.blocks.size | times: 18 | plus: 115 -%}
<div class="slideshow__arrows"
style="width: {{- arrows_width -}}px">
<button class="slideshow__arrow slideshow__arrow-previous" aria-label="{{ 'sections.slideshow.previous_slide' | t }}" data-slider-button>{% include 'icon-chevron-left' %}</button>
<button class="slideshow__arrow slideshow__arrow-next" aria-label="{{ 'sections.slideshow.next_slide' | t }}" data-slider-button data-slider-button-next>{% include 'icon-chevron-right' %}</button>
<ul class="slick-dots" data-slider-indicators>
{%- for block in section.blocks -%}
<li{% if forloop.first %} class="slick-active"{% endif %} data-slider-indicator>
<a href="#Slideshow-{{ section.id }}" aria-label="{{ 'sections.slideshow.load_slide' | t: slide_number: forloop.index }}" data-slide-number="{{ forloop.index0 }}" aria-controls="slickSlide-{{ block.id }}"></a>
</li>
{%- endfor -%}
</ul>
</div>
{%- if section.settings.autorotate -%}
<button type="button" class="slideshow__pause" data-id="{{ section.id }}" aria-live="polite" aria-pressed="false" data-slider-pause>
<span class="slideshow__pause-stop">
{% include 'icon-pause' %}
<span class="icon__fallback-text">{{ 'sections.slideshow.pause_slideshow' | t }}</span>
</span>
<span class="slideshow__pause-rotate">
{% include 'icon-play' %}
<span class="icon__fallback-text">{{ 'sections.slideshow.rotate_slideshow' | t }}</span>
</span>
</button>
{%- endif -%}
{%- endif -%}
</div>
</div>
<div class="slideshow__text-wrap slideshow__text-wrap--mobile">
{% if section.blocks.size > 1 %}
<div class="slideshow__arrows slideshow__arrows--mobile">
<button class="slideshow__arrow slideshow__arrow-previous" aria-label="{{ 'sections.slideshow.previous_slide' | t }}" data-slider-button>{% include 'icon-chevron-left' %}</button>
<button class="slideshow__arrow slideshow__arrow-next" aria-label="{{ 'sections.slideshow.next_slide' | t }}" data-slider-button data-slider-button-next>{% include 'icon-chevron-right' %}</button>
<ul class="slick-dots" data-slider-indicators>
{%- for block in section.blocks -%}
<li{% if forloop.first %} class="slick-active"{% endif %} data-slider-indicator>
<a href="#Slideshow-{{ section.id }}" aria-label="{{ 'sections.slideshow.load_slide' | t: slide_number: forloop.index }}" data-slide-number="{{ forloop.index0 }}" aria-controls="slickSlide-{{ block.id }}"></a>
</li>
{%- endfor -%}
</ul>
</div>
{% endif %}
{%- for block in section.blocks -%}
{%- assign show_text = false -%}
{%- unless block.settings.slide_title == blank and block.settings.subheading == blank -%}
{%- assign show_text = true -%}
{%- endunless -%}
{%- assign show_link_button = false -%}
{%- if block.settings.button_label != blank and block.settings.button_link != blank -%}
{%- assign show_link_button = true -%}
{%- endif -%}
{%- if show_text or show_link_button -%}
<div class="slideshow__text-content slideshow__text-content--mobile{% if forloop.first %} slideshow__text-content--mobile-active{% endif %} text-center" data-slider-mobile-content-index="{{ forloop.index0 }}">
<div class="page-width">
{%- unless block.settings.slide_title == blank -%}
<h2 class="h1 mega-title slideshow__title slideshow__title--mobile{% if section.settings.text_size == 'large' %} mega-title--large{% endif %}">
{{ block.settings.slide_title | escape }}
</h2>
{%- endunless -%}
{%- unless block.settings.subheading == blank -%}
<span class="mega-subtitle slideshow__subtitle slideshow__subtitle--mobile{% if section.settings.text_size == 'large' %} mega-subtitle--large{% endif %}">
{{ block.settings.subheading | escape }}
</span>
{%- endunless -%}
{%- if show_link_button -%}
<a href="{{ block.settings.button_link }}" class="btn slideshow__btn slideshow__btn--mobile">
{{ block.settings.button_label | escape }}
</a>
{%- endif -%}
</div>
</div>
{%- endif -%}
{%- endfor -%}
</div>
{%- endif -%}
{% if section.blocks.size == 0 %}
<div class="placeholder-noblocks">
{{ 'homepage.onboarding.no_content' | t }}
</div>
{% endif %}
</div>
{% schema %}
{
"name": {
"cs": "Prezentace",
"da": "Diasshow",
"de": "Slideshow",
"en": "Slideshow",
"es": "Diapositivas",
"fi": "Diaesitys",
"fr": "Diaporama",
"it": "Presentazione",
"ja": "スライドショー",
"ko": "슬라이드 쇼",
"nb": "Lysbildefremvisning",
"nl": "Diavoorstelling",
"pl": "Pokaz slajdów",
"pt-BR": "Apresentação de slides",
"pt-PT": "Apresentação de diapositivos",
"sv": "Bildspel",
"th": "สไลด์โชว์",
"tr": "Slayt gösterisi",
"vi": "Bản trình chiếu",
"zh-CN": "幻灯片",
"zh-TW": "素材輪播"
},
"class": "index-section index-section--flush index-section--slideshow",
"max_blocks": 6,
"settings": [
{
"type": "select",
"id": "slideshow_height",
"label": {
"cs": "Výška snímku",
"da": "Diashøjde",
"de": "Diahöhe",
"en": "Slide height",
"es": "Altura de diapositiva",
"fi": "Dian korkeus",
"fr": "Hauteur de la diapositive",
"it": "Altezza slide",
"ja": "スライドの高さ",
"ko": "슬라이드 높이",
"nb": "Lysbildehøyde",
"nl": "Diahoogte",
"pl": "Wysokość slajdu",
"pt-BR": "Altura do slide",
"pt-PT": "Altura do diapositivo",
"sv": "Bildhöjd",
"th": "ความสูงของสไลด์",
"tr": "Slayt yüksekliği",
"vi": "Chiều cao trang chiếu",
"zh-CN": "幻灯片高度",
"zh-TW": "投影片高度"
},
"default": "adapt",
"info": {
"cs": "Prostudujte si [nápovědu k prezentaci](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific).",
"da": "Få mere at vide om [slideshow guidelines](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"de": "Erfahren Sie mehr über die [Richtlinien für Slideshows](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"en": "Learn more about [slideshow guidelines](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"es": "Más información sobre [directrices de presentación de diapositivas](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"fi": "Lisätietoja [diaesitysohjeista](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"fr": "En savoir plus sur [directives de diaporama](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"it": "Maggiori informazioni sulle [linee guida per le presentazioni](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"ja": "[スライドショーのガイドライン](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)...",
"ko": "[슬라이드 쇼 가이드라인에 대해 자세히 알아보기](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"nb": "Finn ut mer om [retningslinjer for lysbilder](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"nl": "Meer informatie over [richtlijnen voor diavoorstellingen](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"pl": "Dowiedz się więcej o [wytycznych dotyczących pokazu slajdów](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"pt-BR": "Saiba mais sobre [diretrizes de apresentação de slides](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"pt-PT": "Saiba mais sobre [diretrizes de apresentação de diapositivos](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"sv": "Läs mer om [bildspelets riktlinjer](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"th": "ดูข้อมูลเพิ่มเติมเกี่ยวกับ [แนวทางสไลด์โชว์](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"tr": "[Slayt gösterisi yönergeleri](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific) hakkında daha fazla bilgi edinin",
"vi": "Tìm hiểu thêm về [hướng dẫn trình chiếu](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"zh-CN": "详细了解[幻灯片指南](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)",
"zh-TW": "深入瞭解 [素材輪播準則](https://help.shopify.com/en/manual/using-themes/themes-by-shopify/debut#slideshow-sections-specific)"
},
"options": [
{
"label": {
"cs": "Přizpůsobení prvnímu obrázku",
"da": "Tilpas til første side",
"de": "An erstes Bild anpassen",
"en": "Adapt to first image",
"es": "Adaptar a la primera imagen",
"fi": "Mukauta ensimmäisen kuvan mukaan",
"fr": "Adapter à la première image",
"it": "Adatta alla prima immagine",
"ja": "最初の画像に対応",
"ko": "첫 번째 이미지에 맞춤",
"nb": "Tilpass etter første bilde",
"nl": "Aanpassen aan eerste afbeelding",
"pl": "Dostosuj do pierwszego obrazu",
"pt-BR": "Adaptar à primeira imagem",
"pt-PT": "Adaptar à primeira imagem",
"sv": "Anpassa efter första bilden",
"th": "ปรับให้เข้ากับรูปภาพแรก",
"tr": "İlk görsele uyarla",
"vi": "Điều chỉnh theo hình ảnh đầu tiên",
"zh-CN": "适应第一张图片",
"zh-TW": "配合第一張圖片"
},
"value": "adapt"
},
{
"label": {
"cs": "Malá",
"da": "Lille",
"de": "Klein",
"en": "Small",
"es": "Pequeña",
"fi": "Pieni",
"fr": "Petite",
"it": "Piccolo",
"ja": "小",
"ko": "스몰",
"nb": "Liten",
"nl": "Klein",
"pl": "Mały",
"pt-BR": "Pequeno",
"pt-PT": "Pequeno",
"sv": "Liten",
"th": "เล็ก",
"tr": "Küçük",
"vi": "Nhỏ",
"zh-CN": "小",
"zh-TW": "小型"
},
"value": "small"
},
{
"label": {
"cs": "Střední",
"da": "Medium",
"de": "Mittel",
"en": "Medium",
"es": "Mediana",
"fi": "Keskisuuri",
"fr": "Moyenne",
"it": "Medio",
"ja": "中",
"ko": "보통",
"nb": "Middels",
"nl": "Gemiddeld",
"pl": "Średnie",
"pt-BR": "Médio",
"pt-PT": "Médio",
"sv": "Medium",
"th": "ปานกลาง",
"tr": "Orta",
"vi": "Trung bình",
"zh-CN": "中等",
"zh-TW": "中等"
},
"value": "medium"
},
{
"label": {
"cs": "Velká",
"da": "Stor",
"de": "Groß",
"en": "Large",
"es": "Grande",
"fi": "Suuri",
"fr": "Grande",
"it": "Grande",
"ja": "大",
"ko": "라지",
"nb": "Stor",
"nl": "Groot",
"pl": "Duży",
"pt-BR": "Grande",
"pt-PT": "Grande",
"sv": "Stor",
"th": "ใหญ่",
"tr": "Büyük",
"vi": "Lớn",
"zh-CN": "大",
"zh-TW": "大型"
},
"value": "large"
}
]
},
{
"type": "select",
"id": "text_size",
"label": {
"cs": "Velikost textu",
"da": "Tekststørrelse",
"de": "Textgröße",
"en": "Text size",
"es": "Tamaño del texto",
"fi": "Tekstin koko",
"fr": "Taille du texte",
"it": "Dimensione testo",
"ja": "文字サイズ",
"ko": "텍스트 사이즈",
"nb": "Tekststørrelse",
"nl": "Tekengrootte",
"pl": "Rozmiar czcionki",
"pt-BR": "Tamanho do texto",
"pt-PT": "Tamanho do texto",
"sv": "Textstorlek",
"th": "ขนาดตัวอักษร",
"tr": "Metin boyutu",
"vi": "Cỡ văn bản",
"zh-CN": "文本大小",
"zh-TW": "文字尺寸"
},
"default": "medium",
"options": [
{
"label": {
"cs": "Střední",
"da": "Medium",
"de": "Mittel",
"en": "Medium",
"es": "Mediano",
"fi": "Keskisuuri",
"fr": "Moyenne",
"it": "Medio",
"ja": "中",
"ko": "보통",
"nb": "Middels",
"nl": "Gemiddeld",
"pl": "Średnia",
"pt-BR": "Médio",
"pt-PT": "Intermédio",
"sv": "Medium",
"th": "ปานกลาง",
"tr": "Orta",
"vi": "Trung bình",
"zh-CN": "中等",
"zh-TW": "中等"
},
"value": "medium"
},
{
"label": {
"cs": "Velká",
"da": "Stor",
"de": "Groß",
"en": "Large",
"es": "Grande",
"fi": "Suuri",
"fr": "Grande",
"it": "Grande",
"ja": "大",
"ko": "라지",
"nb": "Stor",
"nl": "Groot",
"pl": "Duża",
"pt-BR": "Grande",
"pt-PT": "Grande",
"sv": "Stor",
"th": "ใหญ่",
"tr": "Büyük",
"vi": "Lớn",
"zh-CN": "大",
"zh-TW": "大型"
},
"value": "large"
}
]
},
{
"type": "select",
"id": "text_alignment",
"label": {
"cs": "Zarovnání textu",
"da": "Tekstjustering",
"de": "Textausrichtung",
"en": "Text alignment",
"es": "Alineación de texto",
"fi": "Tekstin tasaus",
"fr": "Alignement du texte",
"it": "Allineamento del testo",
"ja": "テキストアラインメント",
"ko": "텍스트 정렬",
"nb": "Tekstjustering",
"nl": "Tekstuitlijning",
"pl": "Wyrównanie tekstu",
"pt-BR": "Alinhamento de texto",
"pt-PT": "Alinhamento de texto",
"sv": "Textjustering",
"th": "การจัดตำแหน่งข้อความ",
"tr": "Metin hizalaması",
"vi": "Căn chỉnh văn bản",
"zh-CN": "文本对齐方式",
"zh-TW": "文字對齊"
},
"default": "center center",
"options": [
{
"label": {
"cs": "Nahoře doleva",
"da": "Øverst til venstre",
"de": "Oben links",
"en": "Top left",
"es": "Superior izquierda",
"fi": "Ylhäällä vasemmalla",
"fr": "En haut à gauche",
"it": "In alto a sinistra",
"ja": "左上",
"ko": "왼쪽 상단",
"nb": "Øverst til venstre",
"nl": "Linksboven",
"pl": "Na górze po lewej",
"pt-BR": "Superior esquerdo",
"pt-PT": "Canto superior esquerdo",
"sv": "Överst till vänster",
"th": "ซ้ายบน",
"tr": "Üst sol",
"vi": "Trên cùng bên trái",
"zh-CN": "左上方",
"zh-TW": "左上角"
},
"value": "left top"
},
{
"label": {
"cs": "Nahoře na střed",
"da": "Øverst i midten",
"de": "Oben Mitte",
"en": "Top center",
"es": "Superior centrada",
"fi": "Keskellä ylhäällä",
"fr": "En haut au centre",
"it": "In alto al centro",
"ja": "中央上",
"ko": "맨 위 중간",
"nb": "Toppsentrert",
"nl": "Midden boven",
"pl": "Na górze na środku",
"pt-BR": "Superior centro",
"pt-PT": "Superior centro",
"sv": "Längst upp i mitten",
"th": "กลางบน",
"tr": "Üst orta",
"vi": "Trên cùng ở giữa",
"zh-CN": "顶部居中",
"zh-TW": "中央上方"
},
"value": "center top"
},
{
"label": {
"cs": "Nahoře doprava",
"da": "Øverst til højre",
"de": "Oben rechts",
"en": "Top right",
"es": "Superior derecha",
"fi": "Ylhäällä oikealla",
"fr": "En haut à droite",
"it": "In alto a destra",
"ja": "右上",
"ko": "오른쪽 상단",
"nb": "Øverst til høyre",
"nl": "Rechtsboven",
"pl": "Na górze po prawej",
"pt-BR": "Superior direito",
"pt-PT": "Canto superior direito",
"sv": "Överst till höger",
"th": "ขวาบน",
"tr": "Üst sağ",
"vi": "Trên cùng bên phải",
"zh-CN": "右上方",
"zh-TW": "右上角"
},
"value": "right top"
},
{
"label": {
"cs": "Uprostřed doleva",
"da": "Midt på til venstre",
"de": "Mitte links",
"en": "Middle left",
"es": "Al medio a la izquierda",
"fi": "Keskellä vasemmalla",
"fr": "Au milieu à gauche",
"it": "Nel mezzo a sinistra",
"ja": "中央部左側",
"ko": "왼쪽 중간",
"nb": "Midt til venstre",
"nl": "Midden links",
"pl": "Na środku po lewej",
"pt-BR": "Meio esquerdo",
"pt-PT": "Intermédio à esquerda",
"sv": "Mitten till vänster",
"th": "ซ้ายกลาง",
"tr": "Orta sol",
"vi": "Ở giữa bên trái",
"zh-CN": "中间居左",
"zh-TW": "中央左方"
},
"value": "left center"
},
{
"label": {
"cs": "Uprostřed na střed",
"da": "Midt på centreret",
"de": "Mitte mittig",
"en": "Middle center",
"es": "Centrada en el medio",
"fi": "Keskellä keskellä",
"fr": "Centrée au milieu",
"it": "In mezzo",
"ja": "中心",
"ko": "가운데 중간",
"nb": "Midt i senter",
"nl": "Midden centrum",
"pl": "Na środku",
"pt-BR": "Meio centro",
"pt-PT": "Intermédio ao centro",
"sv": "Mitten centrerat",
"th": "กึ่งกลาง",
"tr": "Orta kısmın ortası",
"vi": "Chính giữa",
"zh-CN": "中间居中",
"zh-TW": "正中央"
},
"value": "center center"
},
{
"label": {
"cs": "Uprostřed doprava",
"da": "Midt på til højre",
"de": "Mitte rechts",
"en": "Middle right",
"es": "Centrado a la derecha",
"fi": "Keskellä oikealla",
"fr": "Au milieu à droite",
"it": "Nel mezzo a destra",
"ja": "中央部右側",
"ko": "오른쪽 중간",
"nb": "Midt til høyre",
"nl": "Midden rechts",
"pl": "Na środku po prawej",
"pt-BR": "Meio direito",
"pt-PT": "Intermédio à direita",
"sv": "Mitten till höger",
"th": "ขวากลาง",
"tr": "Orta sağ",
"vi": "Ở giữa bên phải",
"zh-CN": "中间居右",
"zh-TW": "中央右方"
},
"value": "right center"
},
{
"label": {
"cs": "Dole doleva",
"da": "Nederst til venstre",
"de": "Unten links",
"en": "Bottom left",
"es": "Inferior izquierda",
"fi": "Alhaalla vasemmalla",
"fr": "En bas à gauche",
"it": "In basso a sinistra",
"ja": "左下",
"ko": "왼쪽 하단",
"nb": "Nederst til venstre",
"nl": "Linksonder",
"pl": "Na dole po lewej",
"pt-BR": "Inferior esquerdo",
"pt-PT": "Canto inferior esquerdo",
"sv": "Nere till vänster",
"th": "ซ้ายล่าง",
"tr": "Alt sol",
"vi": "Dưới cùng bên trái",
"zh-CN": "左下方",
"zh-TW": "左下角"
},
"value": "left bottom"
},
{
"label": {
"cs": "Dole na střed",
"da": "Nederst i midten",
"de": "Unten mittig",
"en": "Bottom center",
"es": "Inferior centrada",
"fi": "Keskellä alhaalla",
"fr": "En bas au centre",
"it": "In basso al centro",
"ja": "中央下",
"ko": "맨아래 중간",
"nb": "Bunnsentrert",
"nl": "Midden onder",
"pl": "Na dole na środku",
"pt-BR": "Inferior centro",
"pt-PT": "Inferior centro",
"sv": "Längst ner i mitten",
"th": "กลางล่าง",
"tr": "Alt orta",
"vi": "Dưới cùng ở giữa",
"zh-CN": "底部居中",
"zh-TW": "中央下方"
},
"value": "center bottom"
},
{
"label": {
"cs": "Dole doprava",
"da": "Nederst til højre",
"de": "Unten rechts",
"en": "Bottom right",
"es": "Inferior derecha",
"fi": "Alhaalla oikealla",
"fr": "En bas à droite",
"it": "In basso a destra",
"ja": "右下",
"ko": "오른쪽 아래",
"nb": "Nederst til høyre",
"nl": "Rechtsonder",
"pl": "Na dole po prawej",
"pt-BR": "Inferior direito",
"pt-PT": "Canto inferior direito",
"sv": "Nere till höger",
"th": "ขวาล่าง",
"tr": "Alt sağ",
"vi": "Dưới cùng bên phải",
"zh-CN": "右下方",
"zh-TW": "右下角"
},
"value": "right bottom"
}
]
},
{
"type": "checkbox",
"id": "show_overlay",
"label": {
"cs": "Zobrazit překryv",
"da": "Vis overlejring",
"de": "Überlagerung zeigen",
"en": "Show overlay",
"es": "Mostrar superposición",
"fi": "Näytä peittokuva",
"fr": "Afficher la superposition",
"it": "Mostra sovrapposizione",
"ja": "オーバーレイを表示する",
"ko": "오버레이 표시",
"nb": "Vis overlegg",
"nl": "Overlay weergeven",
"pl": "Pokaż nakładkę",
"pt-BR": "Exibir sobreposição",
"pt-PT": "Mostrar sobreposição",
"sv": "Visa överlagring",
"th": "แสดงการวางซ้อน",
"tr": "Yer paylaşımını göster",
"vi": "Hiển thị lớp phủ",
"zh-CN": "显示叠加",
"zh-TW": "顯示疊加層"
},
"default": true
},
{
"type": "checkbox",
"id": "autorotate",
"label": {
"cs": "Automaticky otočit snímky",
"da": "Roter automatisk slides",
"de": "Auto-rotieren der Slides",
"en": "Auto-rotate slides",
"es": "Rotar las diapositivas automáticamente",
"fi": "Käännä diat automaattisesti",
"fr": "Rotation automatique des diapositives",
"it": "Ruota slide automaticamente",
"ja": "スライドの自動切り替え",
"ko": "슬라이드 자동 회전",
"nb": "Autoroter lysbildene",
"nl": "Dia's automatisch draaien",
"pl": "Automatycznie obracaj slajdy",
"pt-BR": "Rodar os slides automaticamente",
"pt-PT": "Reprodução automática de diapositivos",
"sv": "Auto-rotera bilder",
"th": "หมุนสไลด์อัตโนมัติ",
"tr": "Slaytları otomatik olarak döndür",
"vi": "Tự động xoay vòng trang chiếu",
"zh-CN": "自动旋转幻灯片",
"zh-TW": "自動旋轉投影片"
},
"default": false
},
{
"type": "range",
"id": "autorotate_speed",
"label": {
"cs": "Změnit snímek co",
"da": "Skift slide hver",
"de": "Slides überall ändern",
"en": "Change slides every",
"es": "Cambiar diapositivas cada",
"fi": "Vaihda diat joka",
"fr": "Changer de diapositive toutes les",
"it": "Cambia slide ogni",
"ja": "スライドを変更する間隔",
"ko": "슬라이드를 매번 변경",
"nb": "Endre lysbilde hvert",
"nl": "Wijzig dia's elke",
"pl": "Zmieniaj slajdy co",
"pt-BR": "Mudar os slides a cada",
"pt-PT": "Mudar diapositivos a cada",
"sv": "Byt bilder varje",
"th": "เปลี่ยนสไลด์ทุก",
"tr": "Slaytları şu zaman aralığında değiştir:",
"vi": "Đổi trang chiếu sau mỗi",
"zh-CN": "幻灯片更改时间间隔",
"zh-TW": "每過以下時間即變更投影片"
},
"max": 9,
"min": 3,
"step": 2,
"unit": {
"cs": " s",
"da": " s",
"de": " s",
"en": " s",
"es": " s",
"fi": " s",
"fr": " s",
"it": " s",
"ja": " s",
"ko": " s",
"nb": " s",
"nl": " s",
"pl": " s",
"pt-BR": " s",
"pt-PT": " s",
"sv": " s",
"th": " s",
"tr": " sn",
"vi": " gi",
"zh-CN": " s",
"zh-TW": " s"
},
"default": 5
}
],
"blocks": [
{
"type": "image",
"name": {
"cs": "Obrázkový snímek",
"da": "Billeddias",
"de": "Foto-Slide",
"en": "Image slide",
"es": "Diapositiva de imagen",
"fi": "Kuvadia",
"fr": "Diapositive (image)",
"it": "Slide immagine",
"ja": "画像スライド",
"ko": "이미지 슬라이드",
"nb": "Lysbilde",
"nl": "Afbeelding dia",
"pl": "Slajd obrazu",
"pt-BR": "Slide de imagem",
"pt-PT": "Diapositivo de imagem",
"sv": "Bild i bildspel",
"th": "สไลด์รูปภาพ",
"tr": "Görsel slaytı",
"vi": "Trang chiếu hình ảnh",
"zh-CN": "图片幻灯片",
"zh-TW": "圖片投影片"
},
"settings": [
{
"type": "image_picker",
"id": "image",
"label": {
"cs": "Obrázek",
"da": "Billede",
"de": "Foto",
"en": "Image",
"es": "Imagen",
"fi": "Kuva",
"fr": "Image",
"it": "Immagine",
"ja": "画像",
"ko": "이미지",
"nb": "Bilde",
"nl": "Afbeelding",
"pl": "Obraz",
"pt-BR": "Imagem",
"pt-PT": "Imagem",
"sv": "Bild",
"th": "รูปภาพ",
"tr": "Görsel",
"vi": "Hình ảnh",
"zh-CN": "图片",
"zh-TW": "圖片"
}
},
{
"type": "select",
"id": "alignment",
"label": {
"cs": "Pozice obrázku",
"da": "Placering af billede",
"de": "Foto-Position",
"en": "Image position",
"es": "Alineación de imagen",
"fi": "Kuvan sijainti",
"fr": "Position de l'image",
"it": "Allineamento immagine",
"ja": "画像アラインメント",
"ko": "이미지 위치",
"nb": "Bildeposisjon",
"nl": "Afbeeldingspositie",
"pl": "Położenie obrazu",
"pt-BR": "Alinhamento da imagem",
"pt-PT": "Posição da imagem",
"sv": "Bildposition",
"th": "ตำแหน่งรูปภาพ",
"tr": "Görsel konumu",
"vi": "Vị trí hình ảnh",
"zh-CN": "图片位置",
"zh-TW": "圖片位置"
},
"default": "center center",
"options": [
{
"label": {
"cs": "Nahoře vlevo",
"da": "Øverst til venstre",
"de": "Oben links",
"en": "Top left",
"es": "Superior izquierda",
"fi": "Ylhäällä vasemmalla",
"fr": "En haut à gauche",
"it": "In alto a sinistra",
"ja": "左上",
"ko": "왼쪽 상단",
"nb": "Øverst til venstre",
"nl": "Linksboven",
"pl": "Na górze po lewej",
"pt-BR": "Superior esquerdo",
"pt-PT": "Canto superior esquerdo",
"sv": "Överst till vänster",
"th": "ซ้ายบน",
"tr": "Üst sol",
"vi": "Trên cùng bên trái",
"zh-CN": "左上方",
"zh-TW": "左上角"
},
"value": "left top"
},
{
"label": {
"cs": "Nahoře ve středu",
"da": "Øverst i midten",
"de": "Oben Mitte",
"en": "Top center",
"es": "Superior centrada",
"fi": "Keskellä ylhäällä",
"fr": "En haut au centre",
"it": "In alto al centro",
"ja": "中央上",
"ko": "맨 위 중간",
"nb": "Toppsentrert",
"nl": "Midden boven",
"pl": "Na górze na środku",
"pt-BR": "Superior centro",
"pt-PT": "Superior centro",
"sv": "Längst upp i mitten",
"th": "กลางบน",
"tr": "Üst orta",
"vi": "Trên cùng ở giữa",
"zh-CN": "顶部居中",
"zh-TW": "中央上方"
},
"value": "center top"
},
{
"label": {
"cs": "Nahoře vpravo",
"da": "Øverst til højre",
"de": "Oben rechts",
"en": "Top right",
"es": "Superior derecha",
"fi": "Ylhäällä oikealla",
"fr": "En haut à droite",
"it": "In alto a destra",
"ja": "右上",
"ko": "오른쪽 상단",
"nb": "Øverst til høyre",
"nl": "Rechtsboven",
"pl": "Na górze po prawej",
"pt-BR": "Superior direito",
"pt-PT": "Canto superior direito",
"sv": "Överst till höger",
"th": "ขวาบน",
"tr": "Üst sağ",
"vi": "Trên cùng bên phải",
"zh-CN": "右上方",
"zh-TW": "右上角"
},
"value": "right top"
},
{
"label": {
"cs": "Uprostřed vlevo",
"da": "Midt på til venstre",
"de": "Mitte links",
"en": "Middle left",
"es": "Al medio a la izquierda",
"fi": "Keskellä vasemmalla",
"fr": "Au milieu à gauche",
"it": "Nel mezzo a sinistra",
"ja": "中央部左側",
"ko": "왼쪽 중간",
"nb": "Midt til venstre",
"nl": "Midden links",
"pl": "Na środku po lewej",
"pt-BR": "Meio esquerdo",
"pt-PT": "Intermédio à esquerda",
"sv": "Mitten till vänster",
"th": "ซ้ายกลาง",
"tr": "Orta sol",
"vi": "Ở giữa bên trái",
"zh-CN": "中间居左",
"zh-TW": "中央左方"
},
"value": "left center"
},
{
"label": {
"cs": "Uprostřed ve středu",
"da": "Midt på centreret",
"de": "Mitte mittig",
"en": "Middle center",
"es": "Centrada en el medio",
"fi": "Keskellä keskellä",
"fr": "Centrée au milieu",
"it": "In mezzo",
"ja": "中心",
"ko": "가운데 중간",
"nb": "Midt i senter",
"nl": "Midden centrum",
"pl": "Na środku",
"pt-BR": "Meio centro",
"pt-PT": "Intermédio ao centro",
"sv": "Mitten centrerat",
"th": "กึ่งกลาง",
"tr": "Orta kısmın ortası",
"vi": "Chính giữa",
"zh-CN": "中间居中",
"zh-TW": "正中央"
},
"value": "center center"
},
{
"label": {
"cs": "Uprostřed vpravo",
"da": "Midt på til højre",
"de": "Mitte rechts",
"en": "Middle right",
"es": "Centrado a la derecha",
"fi": "Keskellä oikealla",
"fr": "Au milieu à droite",
"it": "Nel mezzo a destra",
"ja": "中央部右側",
"ko": "오른쪽 중간",
"nb": "Midt til høyre",
"nl": "Midden rechts",
"pl": "Na środku po prawej",
"pt-BR": "Meio direito",
"pt-PT": "Intermédio à direita",
"sv": "Mitten till höger",
"th": "ขวากลาง",
"tr": "Orta sağ",
"vi": "Ở giữa bên phải",
"zh-CN": "中间居右",
"zh-TW": "中央右方"
},
"value": "right center"
},
{
"label": {
"cs": "Dole vlevo",
"da": "Nederst til venstre",
"de": "Unten links",
"en": "Bottom left",
"es": "Inferior izquierda",
"fi": "Alhaalla vasemmalla",
"fr": "En bas à gauche",
"it": "In basso a sinistra",
"ja": "左下",
"ko": "왼쪽 하단",
"nb": "Nederst til venstre",
"nl": "Linksonder",
"pl": "Na dole po lewej",
"pt-BR": "Inferior esquerdo",
"pt-PT": "Canto inferior esquerdo",
"sv": "Nere till vänster",
"th": "ซ้ายล่าง",
"tr": "Alt sol",
"vi": "Dưới cùng bên trái",
"zh-CN": "左下方",
"zh-TW": "左下角"
},
"value": "left bottom"
},
{
"label": {
"cs": "Dole ve středu",
"da": "Nederst i midten",
"de": "Unten mittig",
"en": "Bottom center",
"es": "Inferior centrada",
"fi": "Keskellä alhaalla",
"fr": "En bas au centre",
"it": "In basso al centro",
"ja": "中央下",
"ko": "맨아래 중간",
"nb": "Bunnsentrert",
"nl": "Midden onder",
"pl": "Na dole na środku",
"pt-BR": "Inferior centro",
"pt-PT": "Inferior centro",
"sv": "Längst ner i mitten",
"th": "กลางล่าง",
"tr": "Alt orta",
"vi": "Dưới cùng ở giữa",
"zh-CN": "底部居中",
"zh-TW": "中央下方"
},
"value": "center bottom"
},
{
"label": {
"cs": "Dole vpravo",
"da": "Nederst til højre",
"de": "Unten rechts",
"en": "Bottom right",
"es": "Inferior derecha",
"fi": "Alhaalla oikealla",
"fr": "En bas à droite",
"it": "In basso a destra",
"ja": "右下",
"ko": "오른쪽 아래",
"nb": "Nederst til høyre",
"nl": "Rechtsonder",
"pl": "Na dole po prawej",
"pt-BR": "Inferior direito",
"pt-PT": "Canto inferior direito",
"sv": "Nere till höger",
"th": "ขวาล่าง",
"tr": "Alt sağ",
"vi": "Dưới cùng bên phải",
"zh-CN": "右下方",
"zh-TW": "右下角"
},
"value": "right bottom"
}
]
},
{
"type": "text",
"id": "slide_title",
"label": {
"cs": "Nadpis",
"da": "Overskrift",
"de": "Titel",
"en": "Heading",
"es": "Título",
"fi": "Otsake",
"fr": "En-tête",
"it": "Titolo",
"ja": "見出し",
"ko": "제목",
"nb": "Overskrift",
"nl": "Kop",
"pl": "Nagłówek",
"pt-BR": "Título",
"pt-PT": "Título",
"sv": "Rubrik",
"th": "ส่วนหัว",
"tr": "Başlık",
"vi": "Tiêu đề",
"zh-CN": "标题",
"zh-TW": "標題"
},
"default": {
"cs": "Obrázkový snímek",
"da": "Billeddias",
"de": "Foto-Slide",
"en": "Image slide",
"es": "Diapositiva de imagen",
"fi": "Kuvadia",
"fr": "Diapositive (image)",
"it": "Slide immagine",
"ja": "画像スライド",
"ko": "이미지 슬라이드",
"nb": "Lysbilde",
"nl": "Afbeelding dia",
"pl": "Slajd obrazu",
"pt-BR": "Slide de imagem",
"pt-PT": "Diapositivo de imagem",
"sv": "Bild i bildspel",
"th": "สไลด์รูปภาพ",
"tr": "Görsel slaytı",
"vi": "Trang chiếu hình ảnh",
"zh-CN": "图片幻灯片",
"zh-TW": "圖片投影片"
}
},
{
"type": "text",
"id": "subheading",
"label": {
"cs": "Podnadpis",
"da": "Underoverskrift",
"de": "Untertitel",
"en": "Subheading",
"es": "Subtítulo",
"fi": "Alaotsikko",
"fr": "Sous-titre",
"it": "Sottotitolo",
"ja": "小見出し",
"ko": "소제목",
"nb": "Underoverskrift",
"nl": "Subkop",
"pl": "Nagłówek podrzędny",
"pt-BR": "Subtítulo",
"pt-PT": "Subtítulo",
"sv": "Underrubrik",
"th": "หัวเรื่องย่อย",
"tr": "Alt başlık",
"vi": "Tiêu đề phụ",
"zh-CN": "副标题",
"zh-TW": "子標題"
},
"default": {
"cs": "Představte příběh své značky prostřednictvím obrázků",
"da": "Fortæl dit brands historie gennem billeder",
"de": "Erzähle deine Geschichte mit Fotos",
"en": "Tell your brand's story through images",
"es": "Cuenta la historia de tu marca a través de videos e imágenes",
"fi": "Kerro tuotemerkkisi tarina kuvien kautta",
"fr": "Racontez votre histoire avec des images",
"it": "Racconta la storia del tuo brand con video e immagini",
"ja": "あなたのブランドのストーリーをビデオや画像で伝える",
"ko": "이미지를 통해 브랜드 스토리 이야기하기",
"nb": "Fortell merkevarens historie gjennom bilder",
"nl": "Vertel met afbeeldingen het verhaal van je merk",
"pl": "Opowiedz historię swojej marki za pomocą obrazów",
"pt-BR": "Conte a história da sua marca com vídeos e imagens",
"pt-PT": "Conte a história da sua marca através de imagens",
"sv": "Berätta ditt varumärkes historia genom video och bilder",
"th": "บอกเล่าเรื่องราวของแบรนด์คุณผ่านรูปภาพ",
"tr": "Görsellerle marka öykünüzü anlatın",
"vi": "Chia sẻ câu chuyện thương hiệu của bạn qua hình ảnh",
"zh-CN": "通过图片讲述您的品牌故事",
"zh-TW": "用圖片講述您的品牌故事"
}
},
{
"type": "text",
"id": "button_label",
"label": {
"cs": "Text tlačítka",
"da": "Knaptekst",
"de": "Schaltflächenbeschriftung",
"en": "Button label",
"es": "Etiqueta de botón",
"fi": "Tekstipainike",
"fr": "Texte du bouton",
"it": "Etichetta pulsante",
"ja": "ボタンのラベル",
"ko": "버튼 레이블",
"nb": "Knappetikett",
"nl": "Knoplabel",
"pl": "Przycisk z etykietą",
"pt-BR": "Etiqueta de botão",
"pt-PT": "Etiqueta do botão",
"sv": "Knappetikett",
"th": "ป้ายกำกับปุ่ม",
"tr": "Düğme etiketi",
"vi": "Nhãn nút",
"zh-CN": "按钮标签",
"zh-TW": "按鈕標籤"
}
},
{
"type": "url",
"id": "button_link",
"label": {
"cs": "Tlačítkový odkaz",
"da": "Knaplink",
"de": "Schaltflächenlink",
"en": "Button link",
"es": "Enlace de la diapositiva",
"fi": "Painikelinkki",
"fr": "Lien du bouton",
"it": "Link slide",
"ja": "ボタンのリンク",
"ko": "버튼 링크",
"nb": "Kobling for knapp",
"nl": "Knoplink",
"pl": "Link przycisku",
"pt-BR": "Link do slide",
"pt-PT": "Ligação do botão",
"sv": "Knapplänk",
"th": "ลิงก์ปุ่ม",
"tr": "Düğme bağlantısı",
"vi": "Liên kết trên nút",
"zh-CN": "按钮链接",
"zh-TW": "按鈕連結"
}
}
]
}
],
"presets": [
{
"name": {
"cs": "Prezentace",
"da": "Diasshow",
"de": "Slideshow",
"en": "Slideshow",
"es": "Diapositivas",
"fi": "Diaesitys",
"fr": "Diaporama",
"it": "Presentazione",
"ja": "スライドショー",
"ko": "슬라이드 쇼",
"nb": "Lysbildefremvisning",
"nl": "Diavoorstelling",
"pl": "Pokaz slajdów",
"pt-BR": "Apresentação de slides",
"pt-PT": "Apresentação de diapositivos",
"sv": "Bildspel",
"th": "สไลด์โชว์",
"tr": "Slayt gösterisi",
"vi": "Bản trình chiếu",
"zh-CN": "幻灯片",
"zh-TW": "素材輪播"
},
"category": {
"cs": "Obrázek",
"da": "Billede",
"de": "Foto",
"en": "Image",
"es": "Imagen",
"fi": "Kuva",
"fr": "Image",
"it": "Immagine",
"ja": "画像",
"ko": "이미지",
"nb": "Bilde",
"nl": "Afbeelding",
"pl": "Obraz",
"pt-BR": "Imagem",
"pt-PT": "Imagem",
"sv": "Bild",
"th": "รูปภาพ",
"tr": "Görsel",
"vi": "Hình ảnh",
"zh-CN": "图片",
"zh-TW": "圖片"
},
"settings": {
"autorotate": false,
"autorotate_speed": 5
},
"blocks": [
{
"type": "image"
},
{
"type": "image"
}
]
}
]
}
{% endschema %}
This is an accepted solution.
@nardosnatural, do this to fix it in 20 seconds:
1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:
<script>
function openYoutubeOnNewPage(){
var $buttons = document.querySelectorAll(`.slideshow__text-content [href*='youtube']`);
if (!$buttons){
return;
}
for (var each of $buttons){
each.setAttribute("target", "_blank");
}
}
openYoutubeOnNewPage();
</script>
Kind regards,
Diego
Open sections/slideshow.liquid in the code editor and find the code that looks like this:
Focus on the line that begins with <a hef=". Insert the following code immediately before the > at the end:
{% if block.settings.button_link contains 'youtube' %} rel="noopener" target="_blank"{% endif %}
The final code should look like this:
That said, is there a particular reason why you're sending visitors to watch the video on YouTube? Because Debut also has a video section that lets you embed a YouTube video that visitors can watch right on your store's homepage.
Oh I was not aware of that, that seems like a better idea!
Thanks to everyone who participated in our AMA with 2H Media: Marketing Your Shopify St...
By Jacqui Sep 6, 2024The Hydrogen Visual Editor is now available to merchants in Shopify Editions | Summer '...
By JasonH Sep 2, 2024Note: Customizing your CSS requires some familiarity with CSS and HTML. Before you cust...
By JasonH Aug 12, 2024