Solved

How to adjust image size and border shape on blog and contact us page?

ambientcandle19
Excursionist
47 0 4

I have read the entire forum looking to see if this has already been answered. I could find it for craft.

They should be tiny edits. 

 

1. For the blog post when you open the blog to read it. The image is way too big. Id like for it to be in line with the text underneath.

2. Also for the contact us page. how do i make it so that the border is square and not rounded.

Accepted Solutions (3)
Liqiud_xPert_SJ
Shopify Partner
723 92 112

This is an accepted solution.

#ContactForm input, #ContactForm textarea {
	border: 1px solid #000;
	border-radius: 0px !important;
}
#ContactForm .field:before,
#ContactForm .field:after {
	display:none
}
.article-template__hero-container {
	max-width: 720px;
	width: 100%;
	margin: 0px auto;
}

 

please update this code into the base.css file as instructions described above.

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂

View solution in original post

Liqiud_xPert_SJ
Shopify Partner
723 92 112

This is an accepted solution.

the same css will be applied i shared or you can use an important for css like

 

.article-template__hero-container {
	max-width: 720px !important;
}

 

 

please mark as accept as solution must if your issue has been resolve 🙂

 

thanks

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂

View solution in original post

Liqiud_xPert_SJ
Shopify Partner
723 92 112

This is an accepted solution.

yes please replace the second code with the first one for the blog

 

.article-template__hero-container { max-width: 720px; width: 100%; margin: 0px auto; }

 

thanks

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂

View solution in original post

Replies 15 (15)

Liqiud_xPert_SJ
Shopify Partner
723 92 112

@ambientcandle19welcome to the Shopify Community,

 

I can help you in this please share the store url OR any screenshot, so that i can look into it and give you the solution.

 

thanks

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
ambientcandle19
Excursionist
47 0 4

Screenshot_7-3-2024_214158_lastcandles.myshopify.com.jpegScreenshot_7-3-2024_214135_lastcandles.myshopify.com.jpegThe screenshots are attached. I think it should be quick. For the blog. Just to make it so that it doesn't take up the whole screen. make it fit with the text and be a good size? and for the contact us page just fix the border so its square. I usually do it in theme edit but i couldn't find the section. I looked and looked before I asked. 

Liqiud_xPert_SJ
Shopify Partner
723 92 112

@ambientcandle19 

 

i dont see any screenshot attached can you please share the theme name? you are using?

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
ambientcandle19
Excursionist
47 0 4

I updated the file i can attach here as well Screenshot_7-3-2024_214158_lastcandles.myshopify.com.jpegScreenshot_7-3-2024_214135_lastcandles.myshopify.com.jpeg

Liqiud_xPert_SJ
Shopify Partner
723 92 112

@ambientcandle19 

 

if you are using dawn theme then place below CSS code into your base.css file at the end

 

Online Store >Theme files > Assets > base.css

 

.card.article-card.card--media {
	max-width: 800px;
	width: 100%;
	margin: 0px auto;
}

#ContactForm .field::before, #ContactForm .field::after {
	display: none;
}
#ContactForm input, #ContactForm textarea, #ContactForm button {
	border-radius: 0;
}

 

Thanks

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
ambientcandle19
Excursionist
47 0 4

I am using the craft theme does it change anything??

Liqiud_xPert_SJ
Shopify Partner
723 92 112

then you have to provide me the store URL

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
ambientcandle19
Excursionist
47 0 4

lastcandles.myshopify.com

 

it is the contact us page and blog.

Also if you look at the contact us page the header is also so big. It made all the headers specifically on pages much larger than everything else. So strange....

Liqiud_xPert_SJ
Shopify Partner
723 92 112

This is an accepted solution.

#ContactForm input, #ContactForm textarea {
	border: 1px solid #000;
	border-radius: 0px !important;
}
#ContactForm .field:before,
#ContactForm .field:after {
	display:none
}
.article-template__hero-container {
	max-width: 720px;
	width: 100%;
	margin: 0px auto;
}

 

please update this code into the base.css file as instructions described above.

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
ambientcandle19
Excursionist
47 0 4

Perfect and the blog? The size issue? 😭Screenshot_7-3-2024_214135_lastcandles.myshopify.com.jpeg

Liqiud_xPert_SJ
Shopify Partner
723 92 112

This is an accepted solution.

the same css will be applied i shared or you can use an important for css like

 

.article-template__hero-container {
	max-width: 720px !important;
}

 

 

please mark as accept as solution must if your issue has been resolve 🙂

 

thanks

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
ambientcandle19
Excursionist
47 0 4

the second one works perfect. thanks ill make as solved. Can i go ahead and delete this then or leave it.

} .article-template__hero-container { max-width: 720px; width: 100%; margin: 0px auto; }

Liqiud_xPert_SJ
Shopify Partner
723 92 112

This is an accepted solution.

yes please replace the second code with the first one for the blog

 

.article-template__hero-container { max-width: 720px; width: 100%; margin: 0px auto; }

 

thanks

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂
ambientcandle19
Excursionist
47 0 4

Your the best btw im waiting on one more answer then im done and i can move on to my next phase. thanks so so much for getting back to me. truly appreciate it 

Liqiud_xPert_SJ
Shopify Partner
723 92 112

thanks you

- Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Your Shopify Solution Specialist For further discussion contact: Email ID- Liqud_3xPert_SJ OR Whatsapp
- Buy a Coffee for me to get more frequently help 🙂
- Hire Me to unlock the full potential of your e-commerce store Now 🙂