Some issues and questions

Hello,
The first issue. Could you pls align prices into one line because on my phone they are always placing into two lines occupating unnecessary space. Both catalog and single product page. I like the way how it looks in browser’s validator (e.g. Google) but on my phone (iPhone 11) it looks as you can observe from my screenshots.

The second issue. On desktop sometimes the last line of swatches doesnt look alighned with above ones. Could you pls align it, so that all lines of colour are the same?

The third one. Is there a way to hide those marked product attributes (category and tags) from single product page?

Br, Waldemar

Attachments:

You must be logged in to view attached files.

Hello,

Your menu items are too log in. I can reduce the font size of the text.

Please add this code to the Theme Settings > Custom CSS > Global:

.mobile-nav ul li a {
    font-size: 12px;
}
.mobile-nav .sub-menu-dropdown li a {
    font-size: 12px;
}

You need to upload images of the equal size and set the product description to be one linen or two lines. Please find the instructions on how to configure the images: https://xtemos.com/docs/basel/image-size-in-a-product-grid/

The option to limit the title length is provided in the Theme Settings > Shop https://prnt.sc/r8prxr

Best Regards

No, the code didnt work out. The second and third, I meant something else, not what you answered))

Hello,

I have reduced the font size: it was 16px and now it work now https://prnt.sc/r8uvs0

Please provide a more clear screen with the highlighted problem. On desktop sometimes the last line of swatches doesnt look alighned with above ones

If you want to hide the price on mobile, add this code:

.product-grid-item .price>.amount, .product-grid-item .price ins>.amount {
display:none;
}

Best Regards

Hello guys,
First, on nether of problems I highlighted we have not gotten right solution.
I didnt ask to decrease the font of mobile navi, where I was writting about? Please have a look at the screenshots. I even named each screen to provide you with a hint of which issue it comes to.

1. I need to align prices, both regular and sales in one line. Currently on my phone it is in two lines. One line is regular price, the second line is sales. I dont need it.

2. Pls reread the initial question.

3. Pls reread the initial question.

Hello,

You have attached only one screen. Try to attach the lacking screens.

If you want to hide category and tab, add this code:

.single-product-content .product_meta> span.posted_in {
    display: none;
}
.single-product-content .product_meta> span.tagged_as {
    display: none;
}

In order to set the price in one line, you need to reduce the price font size.

You can change the font by means of Advanced typography option, which allows to choose the item from a drop-down or insert your custom CSS class. Please navigate to the Theme Settings > Typography > Advanced Typography.

Here is the documentation providing more detailed instructions: https://xtemos.com/docs/basel/advanced-typography-settings-2/

Provide the page URL and screen with the swatches problem. I do not see any swatches on the shop page: https://gyazo.com/d5ea46ad8b69fd9a085e86b1e9449ad8 when I try to choose the color I am redirected to the product page.

Best Regards

Hello,
well, your suggestions doesnt work, reduced by size prices are located under each other. Pls find another solution. And yeah, before writting you could have tested it yourself.

A screenshot for the second issue was uploaded.

Your code suggested for the second issue, where it should be added to put changes into action?

Waldemar

Attachments:

You must be logged in to view attached files.

Hello,

1. There are no other options to set the price in one line. The only way is to reduce the font.

2. Please deactivate the plugins not related to the theme and provide a product URL with the problem.

Best Regards

Hello,
1. yes, there is, do it for me, because on some devices it is one lined, on some other two lined. It has to be consistent around all devices.

Hello,

Which page, please, provide the page URL.

Best Regards

Hello,
for example the Home page with some representational products or the catalog mode. The screen is attached

Attachments:

You must be logged in to view attached files.

Hello,

Please give me page URL I understand the problem.

Best Regards

https://dev1.cossmeta.online/

Hello,

Please add this code to the Theme Settings > Custom CSS > Mobile:

 .product-grid-item .price del span{
    font-size: 10px!important;
}
 .product-grid-item .price ins span{
    font-size: 10px!important;
}

Set the font size as per your needs

Best Regards

Hi, sorry, the code is not a solution.

Attachments:

You must be logged in to view attached files.

Hello,

I see it like this https://prnt.sc/rdvl8e

Seems your mobile device displays it in its own manner.

Best Regards

Hello,
It is basically happening on iOS devices. Do you have a solution?

Waldemar

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

@media (max-width: 768px) {
  .product-grid-item .swap-elements .price {
      display: inline-flex;
			align-items: center;
  }
}

Best Regards

Thank you, Elise. We can close up the task related with position of prices.

Waldemar

If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts