Creating a gallery with text and button aside. (Mixing Headline and Gallery)

Site URL: https://fancythatinglewood.com.au/

Hello, 

I like the ‘Headlines’ blocks with the image on one side and some text and button on the other as it’s a great way to highlight a category of product and lead to it very quickly with a button. 
However I’d really like to have a gallery playing automatically (slideshow) instead of having just one image, which would give a better insight with 3-4 pictures playing for that same category. 
if you access the website and scroll down the home page you’ll see a gallery playing the way I want and further down this ‘blue vase’ headline. I’d like this image to be an auto play slideshow gallery. 
Is it possible? 
 

Thanks for your help!

password : FTI452

Up

You can use this plugin to bring back Gallery Slideshow block in SS 7.1.

1 hour ago, tuanphan said:

You can use this plugin to bring back Gallery Slideshow block in SS 7.1.

Hi Tuan,

thanks for your reply unfortunately your link leads to a page not found. 
Best,

VJO 

7 minutes ago, VJO said:

Hi Tuan,

thanks for your reply unfortunately your link leads to a page not found. 
Best,

VJO 

Hi Tuan, 

link now works. One question, how would you add this plugin to the website? Thanks. I’ve never done it.

On 6/24/2021 at 6:26 PM, VJO said:

Hi Tuan, 

link now works. One question, how would you add this plugin to the website? Thanks. I’ve never done it.

When you purchase plugin, you will get a txt file with code. Copy code & add to Code Injection > Footer. Then save & reload the site.

Then, you edit the page >> add a block >> you will see Gallery Block.

On 6/24/2021 at 6:26 PM, VJO said:

Hi Tuan, 

link now works. One question, how would you add this plugin to the website? Thanks. I’ve never done it.

Do you need help on these?

Site URL – https://fancythatinglewood.com.au/?FTI452

1. (Homepage) Equal white box – button height.

https://fancythatinglewood.com.au/?FTI452

2. (Mobile – Header) Reduce logo size?

https://fancythatinglewood.com.au/?FTI542

3. (Mobile – Shop) Want to change text to 2 rows?

https://fancythatinglewood.com.au/shop/?FTI542

4. (Mobile – footer) Make Shipping & Refund in 1 line?

11 hours ago, tuanphan said:

Do you need help on these?

Yes, yes, Yes ! 
thank you for taking the time and spotting these details. 

1. (Homepage) Equal white box – button height. 
Yes please.

2. (Mobile – Header) Reduce logo size?
no, it is fine. 

3. (Mobile – Shop) Want to change text to 2 rows? 
Yes please absolutely. I don’t see many people understand that you’ve got to scroll through. 

4. (Mobile – footer) Make Shipping & Refund in 1 line? 
Yes please. 
 

thank you so much, Tuan, for your assistance so far. 

On 7/11/2021 at 10:01 AM, VJO said:

Yes, yes, Yes ! 
thank you for taking the time and spotting these details. 

1. (Homepage) Equal white box – button height. 
Yes please.

2. (Mobile – Header) Reduce logo size?
no, it is fine. 

3. (Mobile – Shop) Want to change text to 2 rows? 
Yes please absolutely. I don’t see many people understand that you’ve got to scroll through. 

4. (Mobile – footer) Make Shipping & Refund in 1 line? 
Yes please. 
 

thank you so much, Tuan, for your assistance so far. 

Q1. 2. Add to Design > Custom CSS. If it works, let me know. I will continue checking 3, 4.

/* Equal newsletter button */
@media screen and (min-width:992px) {
footer#footer-sections button {
    padding-top: 26px !important;
    padding-bottom: 26px !Important;
}
}
/* Mobile site title */
@media screen and (max-width:767px) {
a#site-title {
    font-size: 19px;
    white-space: nowrap;
}
}

4 hours ago, tuanphan said:

Q1. 2. Add to Design > Custom CSS. If it works, let me know. I will continue checking 3, 4.

/* Equal newsletter button */
@media screen and (min-width:992px) {
footer#footer-sections button {
    padding-top: 26px !important;
    padding-bottom: 26px !Important;
}
}
/* Mobile site title */
@media screen and (max-width:767px) {
a#site-title {
    font-size: 19px;
    white-space: nowrap;
}
}

 

It worked! Thank you

On 7/13/2021 at 9:01 PM, VJO said:

It worked! Thank you

Q3. Add to Design > Custom CSS

/* Shop links */
@media screen and (max-width:767px) {
ul.nested-category-children {
    flex-wrap: wrap !important;
}
}

Hey,

this is how it turns out. Any way it can automatically ‘justify’ the text based on screen width ? And adapt font size automatically. 
thanks, 

VJO

7 hours ago, tuanphan said:

Q3. Add to Design > Custom CSS

/* Shop links */
@media screen and (max-width:767px) {
ul.nested-category-children {
    flex-wrap: wrap !important;
}
}

 

On 7/15/2021 at 11:19 PM, VJO said:

Hey,

this is how it turns out. Any way it can automatically ‘justify’ the text based on screen width ? And adapt font size automatically. 
thanks, 

VJO

add justify-content: center;

2 hours ago, tuanphan said:

add justify-content: center;

Hi Tuan,

it’s either doing nothing or bringing it back to the scroll method.

On 7/17/2021 at 6:58 PM, tuanphan said:

add justify-content: center;

Could we have an opening menu on mobile instead?

21 hours ago, VJO said:

Could we have an opening menu on mobile instead?

21 hours ago, VJO said:

Could we have an opening menu on mobile instead?

You mean reduce text size + center them?

6 hours ago, tuanphan said:

 

You mean reduce text size + center them?

I’d probably prefer having it justified problem is it’s not doing it when I add justify-content: center;

but anything that makes the display more pleasant/aesthetic is welcome.