Hi,
ich arbeite mit der App covet.pics, um Slider mit meinen neuesten Instagram Posts zu meinen Seiten (Debut Theme) hinzuzufügen. Das klappt bei der Home Page sowie den anderes Pages auch wunderbar, nur bei den Collection Sites gibt es ja keine Möglichkeit, den Code dort im HTML passend zu hinterlegen, denn der Slider soll unter den Produkten angezeigt werden. Wo im Code kann ich dies anpassen?
Danke im Voraus!
Grüße
Celina
Gelöst! Zur Lösung
Erfolg.
Alright @CEDOUBLÉ … step by step …
1.) Collectiontemplate anlegen – bei deinem Theme > Code bearbeiten:
2.) Code bearbeiten – z.B. so:
<script>(function() {
function asyncLoad() {
var urls = ["https:\/\/gdprcdn.b-cdn.net\/js\/gdpr_cookie_consent.min.js?shop=celinasshop.myshopify.com","https:\/\/geolocation-recommendations.shopifycloud.com\/locale_bar\/script.js?shop=celinasshop.myshopify.com","https:\/\/geolocation-recommendations.shopifycloud.com\/selectors\/script.js?shop=celinasshop.myshopify.com","https:\/\/www.fontman.in\/static\/js\/font-man-app.js?shop=celinasshop.myshopify.com","https:\/\/marquee-79fab.firebaseapp.com\/main.js?shop=celinasshop.myshopify.com","https:\/\/bismuth-marquee-hosted-script.firebaseapp.com\/scripts\/marquee-script-v1.js?shop=celinasshop.myshopify.com","https:\/\/cdn.shopify.com\/shopifycloud\/shopify_chat\/storefront\/shopifyChatV1.js?api_env=production\u0026button_color=%23000000\u0026button_style=icon\u0026p=bottom_right\u0026shop_id=g5wrALOqdad028OZ6GEgazYPWv4SfmDHtHtttKum4u0\u0026shop=celinasshop.myshopify.com","https:\/\/shopify.covet.pics\/covet-pics-widget-inject.js?shop=celinasshop.myshopify.com","\/\/productreviews.shopifycdn.com\/assets\/v4\/spr.js?shop=celinasshop.myshopify.com"];
for (var i = 0; i < urls.length; i++) {
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = true;
s.src=urls[i];
var x = document.getElementsByTagName('script')[0];
x.parentNode.insertBefore(s, x);
}
};
if(window.attachEvent) {
window.attachEvent('onload', asyncLoad);
} else {
window.addEventListener('load', asyncLoad, false);
}
})();</script>
{% section 'collection-template' %}
<h2 style="text-align: center;"><span>Styled by You</span></h2>
<covet-pics-widget gallery-embed-id="200311"></covet-pics-widget>
3.) Collectiontemplate zuweisen:
4.) Party!
Ich hoffe das hilft,
Mario
@CEDOUBLÉ - super, das du das bei den Seiten soweit schon einmal hingebracht hast. Bei den Collection Seiten ist es insofern anders, als du dort (bisher zumindest) das entsprechende Template (schau mal unter /templates/Collection.liquid) anpassen musstest, bzw davon abgeleitet ein eigenes Template anlegen und den Collections zuweisen konntest.
Mit OS2.0 bekommst du „Sections Everywhere“ - mit dem Konzept kannst du viel mehr Bereiche der Seite - u.a. auch die Collection Pages - mit dem Customizer aufbauen. Themes, die OS2.0 unterstützen, sind in der Theme Liste mittlerweile entsprechend gekennzeichnet. Zum Testen könntest du dir jedenfalls einmal Dawn installieren und das von mir beschriebene damit ausprobieren. Solltest du Sections Everywhere in deinem aktuellen Theme verwenden wollen, dann kann man das normalerweise mit überschaubarem Aufwand nachrüsten; bzw. kann das ein Expert deines Vertrauens. (Meld Dich bei Bedarf gerne!)
Ich hoffe, dass das hilft!
Mario
Hi Mario,
vielen Dank für deine Antwort. 🙂 Da ich bereits sehr viele Änderungen an meinem Theme vorgenommen habe, möchte ich dieses derzeit nicht wechseln. Ich kann bei collection.liquid meinen Slider hinzufügen, jedoch möchte ich, dass dieser nur bei einer ausgewählten Kategorie erscheint und nicht bei allen. Wie mache ich das?
Danke!
Celina
@CEDOUBLÉ welche Art von Slider möchtest du dort einfügen?
Wie oben beschrieben meinen Instagram Feed über die app covet.pics.
@CEDOUBLÉ Gibt’s dafür eine eigene Shopify App? Oder nur einen HTML-Schnipsel?
Hi Mario, es ist keine Shopify eigene App und ich habe einen Code-Schnipsel. 🙂
Erfolg.
Alright @CEDOUBLÉ … step by step …
1.) Collectiontemplate anlegen – bei deinem Theme > Code bearbeiten:
2.) Code bearbeiten – z.B. so:
<script>(function() {
function asyncLoad() {
var urls = ["https:\/\/gdprcdn.b-cdn.net\/js\/gdpr_cookie_consent.min.js?shop=celinasshop.myshopify.com","https:\/\/geolocation-recommendations.shopifycloud.com\/locale_bar\/script.js?shop=celinasshop.myshopify.com","https:\/\/geolocation-recommendations.shopifycloud.com\/selectors\/script.js?shop=celinasshop.myshopify.com","https:\/\/www.fontman.in\/static\/js\/font-man-app.js?shop=celinasshop.myshopify.com","https:\/\/marquee-79fab.firebaseapp.com\/main.js?shop=celinasshop.myshopify.com","https:\/\/bismuth-marquee-hosted-script.firebaseapp.com\/scripts\/marquee-script-v1.js?shop=celinasshop.myshopify.com","https:\/\/cdn.shopify.com\/shopifycloud\/shopify_chat\/storefront\/shopifyChatV1.js?api_env=production\u0026button_color=%23000000\u0026button_style=icon\u0026p=bottom_right\u0026shop_id=g5wrALOqdad028OZ6GEgazYPWv4SfmDHtHtttKum4u0\u0026shop=celinasshop.myshopify.com","https:\/\/shopify.covet.pics\/covet-pics-widget-inject.js?shop=celinasshop.myshopify.com","\/\/productreviews.shopifycdn.com\/assets\/v4\/spr.js?shop=celinasshop.myshopify.com"];
for (var i = 0; i < urls.length; i++) {
var s = document.createElement('script');
s.type = 'text/javascript';
s.async = true;
s.src=urls[i];
var x = document.getElementsByTagName('script')[0];
x.parentNode.insertBefore(s, x);
}
};
if(window.attachEvent) {
window.attachEvent('onload', asyncLoad);
} else {
window.addEventListener('load', asyncLoad, false);
}
})();</script>
{% section 'collection-template' %}
<h2 style="text-align: center;"><span>Styled by You</span></h2>
<covet-pics-widget gallery-embed-id="200311"></covet-pics-widget>
3.) Collectiontemplate zuweisen:
4.) Party!
Ich hoffe das hilft,
Mario
Hi Mario,
ja, tut es, vielen Dank für deine Mühe!! 🙂
Wie auf dieser Seite zu sehen:
https://cedouble.com/pages/cost-per-wear
Die Posts sollen auch unten auf der Seite der Kategorie BAGS erscheinen.
Teil 2 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 16, 2024Teil 1 - Wie die Prinzipien des UX-Designs dir dabei helfen können einen großartigen Shop ...
By Kai Sep 9, 2024Anpassungen des benutzerdefinierten Codes an Shopify-Themes (CSS) leicht gemachtIn diesem...
By Gabe Aug 28, 2024