I would like to try and move my compare at price to the right or left of my price on the same line just like it shows in my collections page as at the moment it seems to clash with my afterpay text and is sitting below the text.
https://www.livindreamz.com/collections/kids-cars/products/disney-captain-america-ride-on-car
Hi @Maj79
I think you can use this code, just paste it to the bottom of the style.css.liquid file.
.product-details-content .product-details-price{
flex-direction: row!important;
flex-wrap: wrap!important;
}
.product-details-content .product-details-price #ProductPrice {
order: 1;
}
.product-details-content .product-details-price #ComparePrice {
order: 2;
margin-bottom: 10px;
}
.product-details-content .product-details-price .afterpay-paragraph {
order: 3;
}
If it works, please like and mark it as a solution :") 
Footnote: The anatomy of a good product page.
Hey @Maj79 ,
To do so you have to change your sections/product-template.liquid code a little bit. Just move to compare price code next to the price.
Please check the screenshot given below.
Let me know if you can do that or provide me with code here.
Thanks!
Thank you this has worked by pasting to my style.css file. I have one other question though as now from my collections page if i quick view a product the compare at price looks the same as my other price so 2 prices side by side the compare at price needs to show with the line through it.
@dmwwebartisan wrote:
Hey @Maj79 ,
To do so you have to change your sections/product-template.liquid code a little bit. Just move to compare price code next to the price.
Please check the screenshot given below.
Sorry my issue is now to do with no line through my compare at price in the product quick view clicking in from my home page.
But This is my whole code in that file i cant see anything like your above code.
{%- assign on_sale = false -%}
{%- if product.compare_at_price > product.price -%}
{%- assign on_sale = true -%}
{%- endif -%}
{%- assign sold_out = true -%}
{%- if product.available -%}
{%- assign sold_out = false -%}
{%- endif -%}
{%- assign current_variant = product.selected_or_first_available_variant -%}
{%- elsif section.settings.product_style == ‘tab_style_2’ -%}
{%- include ‘tab-style-2’ -%}
{%- elsif section.settings.product_style == ‘tab_style_3’ -%}
{%- include ‘tab-style-3’ -%}
{%- elsif section.settings.product_style == ‘gallery’ -%}
{%- include ‘gallery-style’ -%}
{%- elsif section.settings.product_style == ‘sticky’ -%}
{%- include ‘sticky-style’ -%}
{%- elsif section.settings.product_style == ‘slider’ -%}
{%- include ‘slider-style’ -%}
{%- endif -%}
{% style %}
.dynamic_btn {
max-width: 340px;
margin-bottom: 20px;
}
.dynamic_btn button {
padding: 23px 38px;
border-radius: 0;
background-color: {{ section.settings.dynamic_btn_bg }};
font-size: {{ section.settings.dynamic_btn_size }}px;
}
.dynamic_btn button:hover {
background-color: {{ settings.color_primary }} !important;
}
{% if section.settings.show_variant_image %}
.swatch-element.color > label {
height: 30px;
width: 30px;
}
{% endif %}
{% endstyle %}
{% schema %}
{
“name”: “Product”,
“settings”: [
{
“type”: “header”,
“content”: “Product Style”
},
{
“type”: “radio”,
“id”: “content_handle”,
“label”: “Content Position”,
“options”: [
{
“label”: “Left”,
“value”: “content_in_left”
},
{
“label”: “Right”,
“value”: “content_in_right”
}
],
“default”: “content_in_right”
},
{
“type”: “select”,
“id”: “product_style”,
“label”: “Product Style”,
“options”:[
{
“label”: “Tab 1”,
“value”: “tab_style_1”
},
{
“label”: “Tab 2”,
“value”: “tab_style_2”
},
{
“label”: “Tab 3”,
“value”: “tab_style_3”
},
{
“label”: “Gallery”,
“value”: “gallery”
},
{
“label”: “Sticky”,
“value”: “sticky”
},
{
“label”: “Slider”,
“value”: “slider”
}
],
“default”: “tab_style_1”
},
{
“type”: “header”,
“content”: “Product Zoom”
},
{
“type”: “checkbox”,
“id”: “product_zoom_enable”,
“label”: “Product Zoom Enable”,
“default”: true
},
{
“type”: “select”,
“id”: “zoom_type”,
“label”: “Zoom Type”,
“options”:[
{
“label”: “Lens”,
“value”: “lens”
},
{
“label”: “Window”,
“value”: “window”
},
{
“label”: “Inner”,
“value”: “inner”
}
],
“default”: “inner”
},
{
“type”: “header”,
“content”: “Video Button”
},
{
“type”: “checkbox”,
“id”: “show_video”,
“label”: “Enable Video Button”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “show_video_icon”,
“label”: “Show Video Icon”,
“default”: true
},
{
“type”: “text”,
“id”: “video_btn”,
“label”: “Button Text”,
“default”: “View Video”
},
{
“type”: “paragraph”,
“content”: “=> Use Shortcode in your product description to show Video tab- [product_video]Video ID[/product_video]”
},
{
“type”: “paragraph”,
“content”: “How to Get Video ID”
},
{
“type”: “header”,
“content”: “Image Popup”
},
{
“type”: “checkbox”,
“id”: “product_popup_enable”,
“label”: “Product Popup Enable”,
“default”: true,
“info”: “When ‘Product Zoom’ enabled and product style ‘Default’ then it applicable”
},
{
“type”: “header”,
“content”: “Product SKU”
},
{
“type”: “checkbox”,
“id”: “product_sku_enable”,
“label”: “Show Product SKU”,
“default”: true
},
{
“type”: “text”,
“id”: “product_sku_title”,
“label”: “SKU Title”,
“default”: “SKU:”
},
{
“type”: “header”,
“content”: “Product Review”
},
{
“type”: “paragraph”,
“content”: “To enable product review, go to ‘Theme settings > Product Settings’”
},
{
“type”: “header”,
“content”: “Product Description”
},
{
“type”: “radio”,
“id”: “product_description_handle”,
“label”: “Description Handle”,
“options”:[
{
“label”: “Full Description”,
“value”: “full_description”
},
{
“label”: “Short Description”,
“value”: “short_description”
},
{
“label”: “Without Description”,
“value”: “without_description”
}
],
“default”: “short_description”
},
{
“type”: “number”,
“id”: “truncatewords_count_handle”,
“label”: “Description Word Count”,
“default”: 35,
“info”: “If ‘Short Description’ is selected and the shortcode is not used, then it will be applicable”
},
{
“type”: “header”,
“content”: “Product Meta”
},
{
“type”: “checkbox”,
“id”: “product_meta_enable”,
“label”: “Product Meta Enable”,
“default”: true
},
{
“type”: “text”,
“id”: “product_meta_title”,
“label”: “Meta Title”,
“default”: “Book Name:”
},
{
“type”: “text”,
“id”: “product_meta_author”,
“label”: “Meta Author”,
“default”: “Author Name”
},
{
“type”: “text”,
“id”: “product_meta_type”,
“label”: “Meta Product Type”,
“default”: “Product Type”
},
{
“type”: “text”,
“id”: “product_meta_date”,
“label”: “Meta Publish Date”,
“default”: “Item Publish Date”
},
{
“type”: “text”,
“id”: “product_meta_barcode”,
“label”: “Meta Barcode”,
“default”: “Barcode”
},
{
“type”: “header”,
“content”: “Product Variant”
},
{
“type”: “radio”,
“id”: “product_variant_handle”,
“label”: “Variant Option”,
“options”:[
{
“label”: “Select Option”,
“value”: “product_variant_select_option”
},
{
“label”: “Swatch Option”,
“value”: “product_variant_swatch_option”
},
{
“label”: “Without Variant”,
“value”: “product_variant_without_option”
}
],
“default”: “product_variant_swatch_option”
},
{
“type”: “checkbox”,
“id”: “show_variant_image”,
“label”: “Variant image enable”,
“default”: false,
“info”: “The variant image will replace in color field if each variant each image selected. It’s applicable for ‘Swatch Option’”
},
{
“type”: “header”,
“content”: “Dynamic Checkout Buttons”
},
{
“type”: “checkbox”,
“id”: “dynamic_checkout_button_enable”,
“label”: “Enable Dynamic Checkout Buttons”,
“default”: true
},
{
“type”: “color”,
“id”: “dynamic_btn_bg”,
“label”: “Button BG Color”,
“default”: “#1f2226”
},
{
“type”: “range”,
“id”: “dynamic_btn_size”,
“min”: 12,
“max”: 40,
“step”: 1,
“label”: “Button Font Size”,
“unit”: “px”,
“default”: 16
},
{
“type”: “header”,
“content”: “Social Share Option”
},
{
“type”: “checkbox”,
“id”: “social_share_enable”,
“label”: “Show Social Share”,
“default”: true
},
{
“type”: “text”,
“id”: “social_share_title”,
“label”: “Social Share Title”,
“default”: “Share:”
},
{
“type”: “header”,
“content”: “Category”
},
{
“type”: “checkbox”,
“id”: “show_cat”,
“label”: “Show Category”,
“default”: true
},
{
“type”: “text”,
“id”: “cat_title”,
“label”: “Category Title”,
“default”: "Categories: "
},
{
“type”: “header”,
“content”: “Tag”
},
{
“type”: “checkbox”,
“id”: “show_tag”,
“label”: “Show Tag”,
“default”: true
},
{
“type”: “text”,
“id”: “tag_title”,
“label”: “Tag Title”,
“default”: "Tag: "
},
{
“type”: “header”,
“content”: “Payment Option”
},
{
“type”: “checkbox”,
“id”: “payment_option_enable”,
“label”: “Show Payment Option”,
“default”: true
},
{
“type”: “text”,
“id”: “payment_information”,
“label”: “Information”,
“default”: “Guaranteed safe checkout”
},
{
“type”: “image_picker”,
“id”: “payment_image”,
“label”: “Payment Image”
},
{
“type”: “radio”,
“id”: “payment_icon”,
“label”: “Payment Icon”,
“options”:[
{
“label”: “Automatic”,
“value”: “automatic”
},
{
“label”: “Custom Icon”,
“value”: “custom_icon”
}
],
“default”: “custom_icon”
}
],
“blocks”:[
{
“type”: “amazon_payments”,
“name”: “Amazon Payments”,
“limit”: 1
},
{
“type”: “american_express”,
“name”: “American Express”,
“limit”: 1
},
{
“type”: “apple_pay”,
“name”: “Apple Pay”,
“limit”: 1
},
{
“type”: “bitcoin”,
“name”: “Bitcoin”,
“limit”: 1
},
{
“type”: “dankort”,
“name”: “Dankort”,
“limit”: 1
},
{
“type”: “diners_club”,
“name”: “Diners Club”,
“limit”: 1
},
{
“type”: “discover”,
“name”: “Discover”,
“limit”: 1
},
{
“type”: “dogecoin”,
“name”: “Dogecoin”,
“limit”: 1
},
{
“type”: “dwolla”,
“name”: “Dwolla”,
“limit”: 1
},
{
“type”: “forbrugsforeningen”,
“name”: “Forbrugsforeningen”,
“limit”: 1
},
{
“type”: “google_pay”,
“name”: “Google Pay”,
“limit”: 1
},
{
“type”: “jcb”,
“name”: “Jcb”,
“limit”: 1
},
{
“type”: “klarna”,
“name”: “Klarna”,
“limit”: 1
},
{
“type”: “litecoin”,
“name”: “Litecoin”,
“limit”: 1
},
{
“type”: “maestro”,
“name”: “Maestro”,
“limit”: 1
},
{
“type”: “master”,
“name”: “Master”,
“limit”: 1
},
{
“type”: “paypal”,
“name”: “Paypal”,
“limit”: 1
},
{
“type”: “shopify_pay”,
“name”: “Shopify Pay”,
“limit”: 1
},
{
“type”: “sofort”,
“name”: “Sofort”,
“limit”: 1
},
{
“type”: “visa”,
“name”: “Visa”,
“limit”: 1
}
]
}
{% endschema %}
{%- if section.settings.product_zoom_enable -%}
{%- endif -%}
{%- if section.settings.product_popup_enable -%}
{{ ‘jquery.fancybox.css’ | asset_url | stylesheet_tag }}
{%- endif -%}
{%- if section.settings.product_style == ‘product_sticky’ -%}
{% endif %}
Hey @Maj79 ,
If your problem has been solved then no need to do that. 
In that case, you have to modify the liquid code of sections/product-template.liquid file ( for your information ). Is this code of product-template liquid file?
But your problem solved then no need to change liquid code. If you feel that, you have problem with devices then you can think about it. But for now I can see everything is fine.
Thanks!
Am wondering if something like this can be done on our website. www.explrwear.com
The price is very large and bulky on the bottom of each product in the collection grid & also the product grid.
I want the small price ( just the price ) beside the product name. here is a photo of what am wanting.
