shopify의 Debut 테마 맞춤형 체험기

저는 지금 shopify의 Debut 테마의 맞춤형 작업을 맡고 있습니다.
그중에서 겪은 일들도 내 비망록의 뜻에 융합시켜 여기에 기록한다.
나는 수시로 보도 내용을 보충하고 싶다.

주제곡

영역 제목

왠지 제목 부분에 덮여 있는 것처럼 회색 요소가 가득 칠해진 느낌이 든다.
이렇게 수정했습니다.
custom.css의 392행
삭제.section-header:before{content: '';width: 100vw;height: 100%;position: absolute;top: 0;left: 0;background-color: #1d1d1f;의background-color: #1d1d1f;.

/*Section Header CSS Starts*/
.section-header{padding: 50px 0px;position: relative;}
.section-header:before{content: '';width: 100vw;height: 100%;position: absolute;top: 0;left: 0;background-color: #1d1d1f;

는 다음과 같이 수정되었다.

/*Section Header CSS Starts*/
.section-header{padding: 50px 0px;position: relative;}
.section-header:before{content: '';width: 100vw;height: 100%;position: absolute;top: 0;left: 0;

모음집 목록 표시 순서

모음집 목록은 알파벳 순서와 같은 규칙에 따라 정렬할 수 있다.
단, 매장 상황에 따라 소장 표시 순서를 바꾸려면 다음과 같은 방법으로 진행하세요.
다음 공식의 보도를 참고하시오.
https://help.shopify.com/ja/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-vintage-themes/change-collections-page
제 상황은 슬라이드-category입니다.liquid가 수정되었습니다.

            <div class="collections-box-main">

                <div class="collections-box-outer">

                    <div id="owl-example1" class="owl-carousel">
                        {%- for collection in collections -%}
                        <div class="collections-box">
                            <div class="collections-box-inner">
                                <!--
                              These control flow tags check to see if there is a featured image for a collection.
                              If there isn't one, then we assign the image from the first product in the collection.
                            -->

다음과 같이 수정되었습니다.

            <div class="collections-box-main">

                <div class="collections-box-outer">

                    <div id="owl-example1" class="owl-carousel">
                        {% for link in linklists.all-collections.links %}
                        {% assign collection = link.object %}
                        <div class="collections-box">
                            <div class="collections-box-inner">
                                <!--
                              These control flow tags check to see if there is a featured image for a collection.
                              If there isn't one, then we assign the image from the first product in the collection.
                            -->

all-collections는 메뉴를 추가하는 이름입니다.

Boxes Section 이미지 교체

custom.css 다음 줄을 수정합니다.

.boxes-box-2 .boxes-box-inner{background-image: url("box-2.jpg");}

box-2.jpg는 요소의 배경 그림입니다.
box-2.jpg는 왼쪽에서 두 번째 그림을 세는 뜻입니다.