How Can We Help?
IMPORTANT NOTICE: Instagram widget removal
Important : This instagram feature is no longer available starting from the new Plak theme version V-1.4
As of 03/02/2020, the Instagram platform has deprecated its API.
As any Shopify theme that have Instagram feed widget, Plak theme Instagram section has been impacted by this, as the access token depends on this system to connect.
How to remove Instagram feed from Plak theme
The Instagram section can simply disabled from the theme editor, but it is recommended to remove the entire section with all its codes (This will optimize your website loading speed).
Important : The below Instagram feed removal tutorial is not recommended for you if you don’t have some basic knowledge of coding (you may break your site). If you would like us to remove this feature for you for Free, please contact us by mentioning your Licence Key & Your Shopify store URL.
Step 1
From your Shopify dashboard click Online store => Actions => Edit code
Step 2
In the search box, locate the file instagram-feed.liquid, open it and click Delete file
Step 3
In the search box, locate the file theme.liquid, open it and search the keyword instagram. Then delete the entire below line code and click Save
{% if settings.feedify_enable %}{% if template == 'index' %}{% include 'instagram-feed' %} {% endif %}{% endif %}
Step 4
In the search box, locate the file settings_schema.json, open it and search the keyword “name”: “Instagram”. Then delete the entire below line code and click Save
{
"name": "Instagram",
"settings": [
{
"type": "checkbox",
"id": "insta-hide-mob",
"label": {
"de": "Auf dem Handy verstecken",
"en": "Hide on mobile",
"es": "Ocultar en el móvil",
"fr": "Masquer sur mobile"
},
"default": false
},
{
"type": "checkbox",
"id": "feedify_enable",
"label": "Show Instagram feed?"
},
{
"type": "paragraph",
"content": "Important: for setup, Instagram requires a User ID and Access Token; [click here](http:\/\/instagram.pixelunion.net\/) to generate one. For the below, your User ID is the numbers before the first period in the Access Token; 123456789.1677ed0.b28... would mean that 123456789 is your User ID."
},
{
"type": "text",
"id": "instagram-user-id",
"label": "Instagram user id number"
},
{
"type": "text",
"id": "instagram-access-token",
"label": "Instagram access token"
},
{
"type": "text",
"id": "instagram_name",
"label": "Instagram username (do not include the @) -- required for images to link to your profile."
},
{
"type": "header",
"content": "Widget customization settings"
},
{
"type": "text",
"id": "instagram_widget_title",
"label": "Instagram widget title",
"default": "Follow us!"
},
{
"type": "checkbox",
"id": "show_instagram_name",
"label": "Show Instagram username in title?"
},
{
"type": "select",
"id": "instagram_limit",
"label": "Number of photos to pull from Instagram, sorted by most recent",
"default": "4",
"options": [
{
"value": "4",
"label": "4"
},
{
"value": "6",
"label": "6"
},
{
"value": "8",
"label": "8"
},
{
"value": "12",
"label": "12"
}
]
},
{
"type": "checkbox",
"id": "instagram_3",
"label": "Show 3 posts per row? Ideal for narrow layouts with 6 or 12 posts"
},
{
"type": "header",
"content": "Widget style settings"
},
{
"type": "select",
"id": "feedify_preset",
"label": "Choose a design preset",
"default": "preset_1",
"options": [
{
"value": "preset_1",
"label": "Preset 1"
},
{
"value": "preset_2",
"label": "Preset 2"
},
{
"value": "preset_3",
"label": "Preset 3"
},
{
"value": "preset_4",
"label": "Preset 4"
}
]
},
{
"type": "color",
"id": "instagram_header_text",
"label": "Header text color",
"default": "#ff0000"
},
{
"type": "select",
"id": "instagram_header_size",
"label": "Base size",
"default": "28px",
"options": [
{
"value": "22px",
"label": "22px"
},
{
"value": "24px",
"label": "24px"
},
{
"value": "26px",
"label": "26px"
},
{
"value": "28px",
"label": "28px"
},
{
"value": "30px",
"label": "30px"
},
{
"value": "32px",
"label": "32px"
},
{
"value": "34px",
"label": "34px"
},
{
"value": "36px",
"label": "36px"
}
]
}
]
}
Step 5
In the search box, locate the file theme.scss.liquid, open it and search the keyword Instagram. Then delete all the below css codes related to the Instagram Widget except this one .fa-instagram:before{content:”\f16d”;} (which is used to show instagram social icon) :
// instagram widget
.instag-countainer {
padding-bottom: 30px;
padding-top: 40px;
}
.feedify {
margin: 0;
width: 100%;
padding: 10px;
}
.feedify_title {
padding-left: 10px;
}
.feedify_grid {
{% if settings.instagram_3 %}
width: 33%;
{% else %}
width: 25%;
{% endif %}
padding: 0 10px 0 10px;
position: relative;
}
.feedify_img {
{% if settings.instagram_3 %}
width: 300px;
{% else %}
width: 220px;
{% endif %}
}
.feedify_caption {
{% if settings.instagram_3 %}
width: 300px;
{% else %}
width: 220px;
{% endif %}
height: 98%;
position: absolute;
text-align: center;
opacity: 0;
top: 0px;
&:hover {
opacity: 0.7;
background-color: #000;
}
}
.feedify_caption-inner {
position: relative;
top: 25px;
margin: 10px auto;
color: #fff;
vertical-align: middle;
}
.preset_1 {
border: 3px solid rgba(102,102,102, 0.4);
border-radius: 7px;
background-color: rgba(102,102,102, 0.1);
}
.preset_1 h2 {
text-align: center;
position: relative;
top: -15px;
margin-bottom: 2px;
}
.preset_1 h2 a {
border: 3px solid rgba(102,102,102, 0.4);
border-radius: 7px;
padding: 5px;
background-color: rgba(255, 255, 255, 1);
}
.preset_2 {
background-color: rgba(237,237,237, 1);
}
.preset_2 h2 {
font-weight: bold;
text-transform: uppercase;
}
.preset_2 h2 a {
padding-left: 3%;
&:hover {
opacity: 0.7;
}
}
.preset_2 .feedify_grid {
border: 1px solid #bbb;
padding: 5px 10px;
margin: 0px 10px 5px 10px;
background-color: rgba(255,255,255, 1);
{% if settings.instagram_3 %}
width: 30%;
{% else %}
width: 22%;
{% endif %}
}
.preset_2 .feedify_img {
{% if settings.instagram_3 %}
width: 280px;
{% else %}
width: 200px;
{% endif %}
}
.preset_2 .feedify_caption {
{% if settings.instagram_3 %}
width: 280px;
{% else %}
width: 200px;
{% endif %}
left: 3px;
}
.preset_2 .grid {
margin-left: 2%;
}
.preset_3 {
background-color: rgba(255,255,255, 0.3);
}
.preset_2 h2 a {
padding-left: 10px;
&:hover {
opacity: 0.7;
}
}
.preset_4 h2 {
text-align: center;
border-bottom: 2px solid {{ settings.instagram_header_text }};
}
.feedify_title a {
color: {{ settings.instagram_header_text }};
font-family: {{ settings.instagram_header_font }};
font-size: {{ settings.instagram_header_size }};
}
The Alternative
In the case where the Instagram feed is very important for your store, consider installing an app from the official Shopify Apps Store
Notes :
- Adding third-party apps may not be free, moreover we are unable to guarantee that the app will integrate with Plak theme. Any conflicts with the added app and Plak theme would need to be resolved by the app’s developers.
- This will only impact the Instagram feed which has been added to your store through the Plak Theme Editor and does not affect any of your sales channels like the Instagram Channel or your Instagram social icon.
Future releases of Plak theme (starting from V.14) will exclude the Instagram feed section.
[yasr_visitor_votes]