GregOvens

@tuanphan thank you a lot for all you help! 🙂

@tuanphan thank you! That helped 🙂 I would like to ask if there is a way how to alight the text in the second column with the text in the first (left) column for desktop device. I would like to have the "Title" (left text column) be alight with "Description" (right text column). Best Regards, Greg 🙂

@tuanphan thank you. I just used the updated code, but unfortunately it does not work at all. Best Regards, Greg 🙂

@tuanphan I would like to add a new request to the previous one regarding text alignment. Once I checked the product on mobile there are still duplicity text (Description, Author, Product Details). Could you please help me with this also. And I would like the first column would be first on mobile view as well (Title, Location, Date, Limited Edition) and after that would continue the Description, Author, Product Details from second text column. Thank you in advance! Greg

Hi @tuanphan amazing that solved the duplicity! Would it be possible to align the text in second column which starts with "Description" to the "Title" which is within left text column? In principle, move the text in the second column lower. I tried to screenshot what I mean. 🙂 Thank you! Greg

@tuanphan thank you very much! 🙂

Hi @tuanphan could you please check why the text is actually duplicated after header 4 as you can see on my screenshot. Thank you Greg

@tuanphan I am sorry! I edited second product, now it should be correct. Greg

@tuanphan I just added the code block 🙂 Greg

@tuanphan those lines are already "heading 4" . Greg

@tuanphan do you mean like this? Or should I do something else? Thank you. Greg

@tuanphan yes, because I would like to have the most possible capability to adjust position and replace the image via code. I would like to upload Custom File and via CSS be able to adjust the position, size of the image, independetly for Desktop devices and Mobile Phone devices. Thank you very much! 🙂 Greg

@JayVanDyke thank you so much!

@JayVanDyke I would like to ask you if there is a generic way how to handle via CSS code the font size within all my Blog Post Grid layout. I have multiple (tens of) blogs on my website and I would like to make the title of the blog posts adjustable via code. Because I would like to experiment on what could be the correct sweet spot for the font size. One of the Blogs is this one: https://www.slovakspots.com/magazine If the code could be generic for all the blogs across my website and also individual for desktop and mobile phone devices, that would be amazing. 🙂 GregOvens

@JayVanDyke you are amazing! All solved now. Thank you for all your effort! 🙂

@JayVanDyke sorry for that. Of course I have put the code back in. URL: https://www.slovakspots.com/shop/p/gas-station-ii Password: Ulicajekrasnydom

@JayVanDyke that brings the text back and slightly updated the Color but as you can see it still updates only the part of the button around the button text not the whole button

@JayVanDyke New snippet make actually all the text disappear in product detail page 🙂 and add SOLD OUT string above product image on all product page.

@JayVanDyke 2. Problem Solved - Thank you! 3. Button you reviewed is actually correct but once you click on product there is page related to product detail and there is the button which I would like to enhance (screenshot #2) and was originally modified by you suggesting this code snippet: - Which perfectly updated the string within the button to "Sold Out" - But the color is not handled correctly as you can see on my screenshot. - My intention is that button would be same as the correct one: background-color: #d3d3d3; border: 3px solid #333333; color: #333333; opacity: 0.7; #siteWrapper .hentry.sold-out { .sqs-add-to-cart-button-inner { background: gray; font-size: 0; &:before { content: 'Sold Out'; font-size: calc(~"var(--primary-button-font-font-size-value) * 1rem") !important; } } } Best Regards, Greg

Hi @tuanphan could you please help me to solve the challenge I submitted within this ticket? Thank you! 🙂

@tuanphan it would be nice to be able for desktop web site visitors split the text in two columns. 1. Basically everything what is in section Description, Author, Product Details, should be in second column on right side of the product detail page. Please see the screenshot attached. 2. Would it be also possible to adjust the position of "Purchase" button based pixel adjustment from current position different for desktop and mobile phone visitors? Please see the screenshot. Thank you very much in advance! 🙂

@JayVanDyke thank you very much for your amazing help! 🙂 With regards to the: 1. Problem solved. Thank you! 2. I would like to actually remove that string "SOLD OUT" so there would be just a price. Or even remove the whole section price + SOLD OUT string, if that would be easier. 3. I am struggling to refactor this code snippet so it would change to button color properly. Currently the button looks like on attached screenshot #1. #siteWrapper .hentry.sold-out { .sqs-add-to-cart-button-inner { background-color: #d3d3d3; /* border: 3px solid #333333; /* 3px dark gray border */ color: #333333; font-size: 0; &:before { content: 'Sold Out'; font-size: calc(~"var(--primary-button-font-font-size-value) * 1rem") !important; } } } And I would like to somehow make it more designe like this so it would looks like button on screenshot #2: background-color: #d3d3d3; border: 3px solid #333333; color: #333333; opacity: 0.7; 4. Problem solved. Thank you! Best Regards Greg 🙂

@tuanphan thank you!

Hi @Spark-Plugin thank you very much 🙂 Well, I would like to be able to move around with the image, to set to correct position and the Custom File and CSS code allows me to adjust based on pixels. Instead of image block is not that flexible. Also during the year I might want to change the Header or Image and it will be easier to setup new position based on pixels margin. What do you think about it? Cheers!

Site URL: https://www.slovakspots.com/shop Hello community 🙂 I would like to ask how I can change the following things when a product is sold out in general: How can I change the color of the button on the product listing page (URL, screenshot 1) from light green to another color (let's say gray)? How can I move the "SOLD OUT" text lower on that same page? When I click on a sold-out product and am on the product detail page (URL 2 , Screenshot 2) How can I change the "Purchase" button color to gray? Change the "Purchase" text to "Sold Out"? How could I add on top of the sold out product Custom File png image on top left corner with custom margin. (URL, screenshot_3)? Not sure if that could be somehow automated, if not it's ok, I could do it manually for each sold out item since my shop will offer small number of items. URL: https://www.slovakspots.com/shop URL 2: https://www.slovakspots.com/shop/p/gas-station-ii Password: Ulicajekrasnydom Thank you so much! 🙂