Hello.
I wanted to add a metafield to my product grid which I did with this code:
{% if product.metafields.custom.framsida %}
Everything works fine, but the problem is that depending on how long my title and metafield text is, the price is put on different heights. Like in this picture:
I have been trying to change the code to make sure the price is always shown at the bottom of the grid no matter the amount of text on top of it. Is there any one that can look through my code and see where changes can be made? I apologize for the long text following:
{% comment %}
/**
- @Anonymous {object} product - product object
- @Anonymous {string} [classes] - additional classes to add to the grid item
- @Anonymous {boolean} [no_actions] - whether to show the quick add and quick shop buttons
- @Anonymous {boolean} quick_add_enable - whether quick add is enabled
- @Anonymous {boolean} quick_shop_enable - whether quick shop is enabled
- @Anonymous {string} [type] - whether the grid item is horizontal or not
- @Anonymous {string} product_grid_image_size - the image size to use for the grid item
- @Anonymous {string} [image_style] - whether the image is square or circle
- @Anonymous {object} collection - the collection object
- @Anonymous {boolean} product_grid_image_fill - whether the image should fill the grid item
- @Anonymous {string} [sizes] - image sizes
- @Anonymous {string} [sizeVariable] - image size variable used in image size calculations
- @Anonymous {string} [fallback] - fallback used in image size calculations when first condition is not met
- @Anonymous {boolean} product_hover_image - whether second image will be shown on hover
- @Anonymous {boolean} enable_swatches - whether swatches are enabled
- @Anonymous {boolean} vendor_enable - whether to show the vendor
- @Anonymous {boolean} product_save_amount - show save amount
- @Anonymous {string} product_save_type - dollar or percent
- @Anonymous {boolean} enable_product_reviews - whether to show product reviews
- @Anonymous {string} [hydration] - hydration mode - (default: ‘on:idle’)
*/
{% endcomment %}
{%- liquid
assign hydration = hydration | default: ‘on:idle’
assign on_sale = false
if product.compare_at_price > product.price
assign on_sale = true
endif
assign product_tags = product.tags | join: ‘,’
assign has_custom_label = false
assign custom_labels = ‘’
if product.metafields.theme.label and product.metafields.theme.label != blank
assign has_custom_label = true
assign custom_labels = product.metafields.theme.label.value
elsif product_tags contains ‘label’
for tag in product.tags
if tag contains ‘label’
assign tag_starts_with = tag | slice: 0
if tag_starts_with == ‘_’
assign has_custom_label = true
assign custom_label = tag | replace: ‘label’, ‘’
assign custom_labels = custom_labels | append: custom_label | append: ‘,’
endif
endif
endfor
endif
-%}
<is-land class=“grid-item” {{ hydration }}>
{%- unless no_actions -%}
{%- if quick_add_enable or quick_shop_enable -%}
{%- liquid
assign imageRatio = product_grid_image_size
assign fixed_aspect_ratio = false
unless imageRatio == ‘natural’
assign fixed_aspect_ratio = true
endunless
if image_style == ‘circle’
assign fixed_aspect_ratio = true
assign imageRatio = ‘square’
endif
assign preview_image = product.featured_media.preview_image
-%}
{%- unless product.available -%}
{%- if fixed_aspect_ratio -%}
{%- if product_hover_image and product.media.size > 1 -%}
{%- for media in product.media offset: 1 limit: 1 -%}
{%- assign second_image = media.preview_image -%}
{%- endfor -%}
{%- if enable_swatches -%}
{%- assign swatch_trigger = ‘products.general.color_swatch_trigger’ | t | downcase -%}
{%- for option in product.options_with_values -%}
{%- liquid
assign option_name = option.name | downcase
assign is_color = false
if option_name contains swatch_trigger
assign is_color = true
elsif swatch_trigger == ‘color’ and option_name contains ‘colour’
assign is_color = true
endif
-%}
{%- if is_color -%}
{%- assign option_index = forloop.index0 -%}
{%- assign values = ‘’ -%}
{%- for variant in product.variants -%}
{%- assign value = variant.options[option_index] %}
{%- unless values contains value -%}
{%- assign values = values | join: ‘,’ | append: ‘,’ | append: value | split: ‘,’ -%}
{%- if variant.image -%}
{% if product.metafields.custom.framsida %}
{%- if vendor_enable -%}
{%- else -%}
{%- if on_sale -%}
{{ ‘products.general.sale_price’ | t }}
{%- endif -%}
{%- render ‘price’,
price: product.price,
shop: shop,
superscript_decimals: superscript_decimals,
-%}
{%- endif -%}
{%- if on_sale -%}
{{ ‘products.general.regular_price’ | t }}
{%- render ‘price’,
price: product.compare_at_price,
shop: shop,
superscript_decimals: superscript_decimals,
-%}
{%- if product_save_amount -%}
{%- if product_save_type == ‘dollar’ -%}
{%- capture saved_amount -%}{{ product.compare_at_price | minus: product.price | money_without_trailing_zeros }}{%- endcapture -%}
{%- else -%}
{%- capture saved_amount -%}{{ product.compare_at_price | minus: product.price | times: 100.0 | divided_by: product.compare_at_price | round }}%{%- endcapture -%}
{%- endif -%}
{{ ‘products.general.save_html’ | t: saved_amount: saved_amount }}
{%- endif -%}
{%- endif -%}
{%- assign product_variant = product.selected_or_first_available_variant -%}
{%- if product_variant.unit_price_measurement -%}
{{ product_variant.unit_price | money }}/{{ unit_price_base_unit }}
{%- if enable_product_reviews -%}
{%- endif -%}
{%- if enable_swatches and type == ‘horizontal’ -%}
{%- render ‘swatches’, product: product -%}
{%- endif -%}
