Last active
September 26, 2022 07:56
-
-
Save PhongGCS/09e89ca193bfcb6c024ca02c501bd54e to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
### 1. Add style.css assets/main.js child theme | |
### 2. Add % giảm giá của sản phẩm | |
### 3. Thêm fontawesome | |
### 4. Thêm Theme Option ACF | |
### 5. Tạo Taxonomy | |
### 6. Lấy danh sách taxonomy theo post id (product id) | |
### 7. Add font face | |
### 8. Style accordion minus plus icon | |
### 9. Change Icon slider flatsome | |
### 10. Conver dot flatsome slider to number | |
### 11. List item in 3 column |
Lấy danh sách taxonomy theo post id (product id)
<?php $thuongHieu = get_the_terms( $post->ID, "thuong-hieu" ); var_dump($thuongHieu); ?>
Add Font face
@font-face {
font-family: 'Imbue';
src: url('assets/fonts/Imbue-Thin.woff2') format('woff2'),
url('assets/fonts/Imbue-Thin.woff') format('woff');
font-weight: 100;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Piazzolla';
src: url('assets/fonts/Piazzolla-Thin.woff2') format('woff2'),
url('assets/fonts/Piazzolla-Thin.woff') format('woff');
font-weight: 100;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Piazzolla';
src: url('assets/fonts/Piazzolla-ThinItalic.woff2') format('woff2'),
url('assets/fonts/Piazzolla-ThinItalic.woff') format('woff');
font-weight: 100;
font-style: italic;
font-display: swap;
}
Style Accordion minus plus icon
.accordion-title .toggle:before {
content: '\f067';
font-family: "Font Awesome 5 Free";
opacity: 1;
}
.accordion-title.active .toggle:before {
content: '\f068'!important;
}
.accordion-title .toggle {
left: unset;
right: 0;
}
.accordion .accordion-item:first-child a {
border-top: unset !important;
}
Change icon slider flatsome
.slider-v1 .flickity-button {
content: "";
width: 74px;
height: 25px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
top: unset;
bottom: -60px;
}
.slider-v1 .flickity-prev-next-button:disabled, .slider-v1 button.flickity-prev-next-button[disabled] {
opacity: 1 !important;
background-size: contain !important;
background-repeat: no-repeat !important;
background-position: center !important;
}
.slider-v1 .flickity-button.previous {
background-image: url("/wp-content/themes/pagoda/assets/imgs/previous-arrow.png");
}
.slider-v1 .flickity-button.previous:disabled {
background-image: url("/wp-content/themes/pagoda/assets/imgs/left-arrow-disable.png") !important;
}
.slider-v1 .flickity-button.next {
background-image: url("/wp-content/themes/pagoda/assets/imgs/new-arrow.png");
}
.slider-v1 .flickity-button.next:disabled {
background-image: url("/wp-content/themes/pagoda/assets/imgs/right-arrow-disable.png") !important;
}
.slider-v1 svg {
display: none;
}
10. Conver dot flatsome slider to number
.slider-v2 ol.flickity-page-dots li.dot {
counter-increment: css-counter 1;
width: 20px;
height: 20px;
text-align: right;
border: none !important;
background: none !important;
font-size: 16px;
line-height: 20px;
color: #000;
left: 0;
opacity: 1;
}
11. List item in 3 column
ul {
-webkit-columns: 3 auto;
-moz-columns: 3 auto;
column-count: 3;
}
ul {
display: inline-block;
width: 100%;
list-style: none;
vertical-align: top;
padding-left: 0;
margin-bottom: 0;
margin-top: 0;
grid-gap: 0 2.5rem;
-webkit-columns: 1 auto;
-moz-columns: 1 auto;
column-count: 1;
}
ul li {
display: inline-block;
width: 100%;
margin-top: 5px;
list-style: none;
border-bottom: 1px dashed #cecece;
padding-bottom: 10px;
line-height: 1;
}
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Tạo Taxonomy