Disable certain Shopify apps on certain pages - shopify

There are about 20 apps installed on our shop. Different apps are used on different pages. For example, there are apps which are used on the product page only.
However I see that all apps are loaded on every page. Looking into page source I see JavaScript function asyncLoad which is part of built-in {{ content_for_header }} variable. This function load scripts for all apps on every page. So, can I restrict this somehow? I mean - to avoid of downloading scripts/css/whatever of apps which I don't use on the specific page. For example, on the home page I need just a couple of apps active, not all 20 of them. Didn't find the answer in docs or Google.

It sounds like you've already figured out a lot about how Shopify allows apps to load their scripts, so you're most of the way there!
When I've needed to selectively disable apps, I have removed them from the asyncLoad function using something like the following:
{% capture modified_content_for_header %}{{ content_for_header }}{% endcapture %}
{% if template.name == 'index' %}
{% assign modified_content_for_header = modified_content_for_header | remove: 'some_app_url.js,' %}
{% endif %}
<!-- If you have a lot of templates you are checking, a case/when using template.name might be appropriate -->
{{ modified_content_for_header }}
I like using {% if template.name == value %} rather than {% if template contains value %} for template checks, as that ensures I don't accidentally get a false positive for a template suffix that contains one of the other template types for some reason, like a collection.alternate_product_layout or something silly like that.
Disclaimer: Messing with 3rd party apps by removing their script files may have unexpected side-effects, so always be sure to exercise caution and test thoroughly on an unpublished theme!

Related

How to use a Shopify Section across a Layout?

I have a section with content that can be edited from the Shopify Customizer. I use this section across multiple pages, but the content remains the same.
Is there a way to instead bind this section to a whole layout?
Because when you update the content, you have it re-enter it on every single page template that uses this section. I can have static HTML across all page templates that use a layout, but this isn't useful because the content needs to be editable from the Shopify Customizer.
You can have a section across a layout after all.
I was doing
layout/my-new-layout.liquid:
{% render 'section-component.liquid' %}
when I was supposed to be doing
layout/my-new-layout.liquid:
{% section 'section-component.liquid' %}
For reference
If you're trying to convert a template-only section to a layout-only section...
Remove the section JSON data from the template: templates/page.your-template.json.
Add a {% section 'your-section' %} in the layout (i.e. layout/my-new-layout.liquid).

Using Porto theme 3.6.3 in Shopify how can I turn off add to cart on specific products?

In Shopify I need to control whether certain products are able to display add to cart.
In the past I have tagged the product as "hide cart" and switched theme template to a version without the button.
How could I do this using the Porto theme?
Does it have a built in method of doing this or do I need to manipulate the theme partials / templates?
The simplest way that I can think of is to add a tag to all the products that you want to hide the add to cart button from, for example hide-add-to-cart.
Then find the code that renders the button and wrap it in an unless statement:
{% unless product.tags contains 'hide-add-to-cart' %}
<button>Add to cart</button>
{% endunless %}
Does it have a built-in method of doing this or do I need to manipulate the theme partials/templates?
No, there is no way to do it, rather than modify the existing code or add a new template and assign the template to a particular product like your previous theme.
So basically there are 2 ways to achieve it:
as #Karim Tarek said you need to tag those products and then check the particular tag into snippets where the Add to cart formed and disable it or hide it.
you need to create a template where you simply copy the code from the default product template and comment the code is for Add to cart and choose this template for those products on which you don't want to show the Add to cart button.
Code samples:
1.
{% unless product.tags contains 'you tag to hide product' %}
you HTML code that formed the Add to cart button
{% endunless %}

How to Add Header and Footer in Grav CMS

I know how to add content in Grav CMS but i am facing problem in how to add a header section in Grav CMS. Please tell me where do i have to write the code for header and footer. In (.md) files or twig files?
As domsson already noted, there are more than a single way to do it in Grav
You can check implementation of it in (default) Quark theme:
templates/partials/base.html.twig, which is used by all other templates, have in needed location {% include 'partials/footer.html.twig' %} and footer.html.twig, in turn, contain all needed data for rendering on page
You can also see (use) idea from Open Publishing Space skeleton
{# display footer markdown page - hibbittsdesign.org #}
{% set content = pages.find('/footer').content %}
{% if content %}
{{ content|raw }}
{% endif %}
Here ordinary page (/footer) from site (editable as much as needed) used instead of template and have anything in it, it's content used as site-footer
If you have site with modular-pages only (like, f.e. Deliver skeleton), you can also (except using base-template as per p.1) add to all modular-collections
content:
items: #self.modular
…
page, which share common template (and data)

block certain text from appearing on Shopify product pages in the description

I import my ads from eBay to Shopify (https://asiasell.com.au). In the product descriptions in the Shopify site I want to display only the text that is NOT related to eBay. I think if I do the opposite, hide eBay related text, then google might think I'm trying to hide keywords. It's a couple of paragraphs I want to NOT show. I'm going to guess that I add code to the timber.scss.liquid file. Thanks!
Like the comments say you question is very edgy in the sense that this isn't exactly about programming. However I would like to see what you've tried. For now I can just answer your question with Sudo.
You need to first find the product.liquid (I don't know what theme you're using but this is just general) and you need to do something like
{% assign description_text = 'something that is in that text' %}
{% if product.description contains {{ description_text }} %}
hide // this actually adds the class hide to this product
{% endif %}
Then in css somewhere you can do:
.hide {
display: none;
}
If you ever need help with something like this then you can use the Shopify forum. To be franlky honest I don't see why those questions are accepted on Stack when Shopify have a whole forum for developers to discuss coding in liquid specifcally for Shopify.

How to edit content on pages for Collection Tags in Shopify

When creating Collections in Shopify I can easily add Tags to them, which are then displayed on the Collections pages (in most of the themes I've used so far). The Collections page will typically show all the Tags for any Product within that Collection.
If you click the Tag it will go to a new page. I'm trying to find a way to edit those pages - it does not appear that this ability is built into Shopify, so I'm looking for the best solution.
There are easily over a hundred tags on this site too. My hope is to avoid writing a ton of conditional statements, but I fear that may be my only option.
Liquid - Example of what I'm thinking:
{% if current_tags == 'tag-name' %}
unique content for that tag
{% endif %}
Can anyone point me in a better direction?
The solution was simpler than I thought. I was using == when I should have been using 'contains'. Not that if your tags use spaces then you should type them exactly the same vs adding dashes to fill spaces.
Example:
{% if current_tags contains 'My Tag' %}
<!-- Custom HTML goes here -->
{% endif %}