hello i was wondering how to move the product title price and reviews to the top of page in mobile only.
i have tried already using this code however it just moves all product block to top of page (image attached) is there a way to isolate just the title, reviews and price block to the top of page.
And its also duplicated the reviews icon and moved it to the top but is also only 1 product block so if i hide the reviews icon product block it will also remove the top and bottom one.
im also using refresh theme
Heres the code i used:
{%- for block in section.blocks -%}
{%- case block.type -%}
{%- when '@app' -%}
{% render block %}
{%- when 'title' -%}
# {{ product.title | escape }}
##
{{ product.title | escape }}
{%- when 'price' -%}
{%- render 'price',
product: product,
use_variant: true,
show_badges: true,
price_class: 'price--large'
-%}
{%- when 'rating' -%}
{%- if product.metafields.reviews.rating.value != blank -%}
{% liquid
assign rating_decimal = 0
assign decimal = product.metafields.reviews.rating.value.rating | modulo: 1
if decimal >= 0.3 and decimal <= 0.7
assign rating_decimal = 0.5
elsif decimal > 0.7
assign rating_decimal = 1
endif
%}
{{- product.metafields.reviews.rating.value }} /
{{ product.metafields.reviews.rating.value.scale_max -}}
({{ product.metafields.reviews.rating_count }})
{{- product.metafields.reviews.rating_count }}
{{ 'accessibility.total_reviews' | t -}}
{%- endif -%}
{%- endcase -%}
{%- endfor -%}
Thanks