Format a phone number in Shopify's Liquid - shopify

How does one go about formatting a phone number in Shopify using Liquid? The shop.phone object seems to output in a way that is specific to shop settings.

Much can be accomplished with only a few Liquid filters.
For example, we wanted to make phone numbers clickable within email notifications. Below is how shop.phone outputs the number for our shop.
(555) 555-5555
Fortunately, the filter method outputs directly to the page so there is no need to assign a variable.
{{ shop.phone | remove: "(" | remove: ")" | replace: " ", "-" }}
Our finished snippet looked like this:
{{shop.phone}}

Related

Replacing commas with spaces for classes in Shopify

I am using product tags as a way to filter what users see depending on if they are commercial or consumer customers. I have managed to get the tags into the class of each product displayed in a collection using the following code. The {{itemTags}} is being used to pass the value over into the HTML.
itemHtml = itemHtml.replace(/{{itemTags}}/g, data.tags);
<div class="{{itemTags}}">
The only issue is that all of the tags are displayed in a string with no spaces and commas in between each one. Resulting in the following class being added as an example.
class="accessories,Consumer,DJI Air 2S,live,pre-order,preorder"
Is it possible to remove the commas and add spaces in between each tag?
use the replace tag in liquid
itemHtml = itemHtml.replace(/{{itemTags | replace: "," , " " }}/g, data.tags);

Nunjucks Include Path with Variable from Data in a Macro

Hoping somebody can provide a little insight into an issue I'm having with Nunjucks. Here's the scenario...
I'm trying to produce a single page that loads some data and an HTML file from a JSON Data file. I'm using a Macro to loop through the Data JSON. Within the macro I can say:
templates/elements/{{ title | lower | replace(" ", "-") }}.html
And it will output a relative URL to the HTML snippet I want - title comes from the JSON.
When I try to do the same thing as an include, I get parsing errors in Gulp.
{% include "../elements/" + {{ title | lower | replace(" ", "-") }} + ".njk" %}
My understanding is that this is an order of operations thing with Nunjucks. So how do I get around this? I need to load the HTML snippet for several files and it doesn't make sense to store it in the Data JSON.
Hopefully that makes sense!
Any thoughts are appreciated.
Thanks,
Brian

In Shopify, am i able to change the display of variants title?

my variants title is “pack/4 bottles:4/PK”
“4/PK” is needed for shipping company to catch specific item.
However, it looks ugly when "4/PK" is displayed on page
Is there a way to hide it? Which liquid template should i touch?
Should I use
{{variant.title|move:'4/PK'}}
where should i put this code?
While this sounds more like something that should be assigned as an option for your variants instead of in the title, you can hide the part of the variants title that you don't want via using split and first
https://help.shopify.com/themes/liquid/filters/string-filters#split
split can be used to split a string (in this case your variant.title) into an array based on a set delimiter to divide it.
So you could do something only the lines of
{{variant.title | split: ':' | first }}
In your case, the output of the above would be: pack/4 bottles.
As for which liquid templates you will need to edit this into ... it will depend on your store. However some common areas would be:
product.liquid
cart.liquid
I highly recommend you read the the shopify liquid documents Here
Also, make sure to make a backup theme before doing any liquid changes in your theme that you are unsure of.
Hope this helps!

How to output a plaintext for each loop with Jade view engine

I'm trying to render out a plaintext string for emailing using the Jade view engine. I'm having trouble getting the right syntax for a plaintext output using a for each loop. Works fine with regular HTML, just not the plain text version:
| Bill to:
| #{customer.active_card.name}
|
- each lineitem in invoice.lines
= lineitem.description
Outputs
Bill to:
Freddy Mac
<p>Line item 1 description</p><p>Line item 2 description</p>
I can't figure out how to format the lineitem.description line so that I get a simple plaintext output so that it would look like this:
Bill to:
Freddy Mac
Line item 1 description
Line item 2 description
Any suggestions on how to tackle this ridiculously obscure edge case for Jade?
Many thanks!
Are you sure the <p> tag isn't really in the lineitem.description variable value itself? I tried your example and didn't get an unexpected <p> tag.
Second note that if you want plain text, you probably don't want jade's default HTML escaping, so use != instead of =.
For what it's worth, jade is really heavily focused on HTML specifically and using it for plain text is probably going to be annoying. Have you considered an alternate templating language like underscore templates?

Scrapy: Item discrepancy

Scenario: a page with multiple items, each consisting of title, description, image. What happens when one of the items are missing the title? How does scrapy handle it? It seems that scrapy blindly selects all titles //div[id='content']/ul/li/div[id='title']/text(),
Expected output is that that row will have a missing title. But I fear that since it blindly selects all titles on the page without considering the item context. If the 5th item is missing title, wouldn't it mistakenly use the 6th item's title instead?
title1 | description | image
.
.
title4 | description | image
title6 | description | image <--- it's supposed to be missing the title.
| description | image
Does scrapy have a way to deal with this problem?
A workaround I was thinking would be to look at the parent item element, and then, look inside that item. If something is missing don't show it.
there are variety of ways you can handle this situation
1) you can implement a pipeline that can skip items that are not required
2) you can add check in your extraction part to only yield/return an item that is required
you needs to understand Scrapy is a high level crawling Framework , that is also providing builten support for data extraction , you can use any library for extraction you would like to.