Brooklyn theme

[KochKistl]

First, icon does not show:

https://www.kochkistl.at/51022725298/checkouts/5f2d17e4f4c3934b914ad46be290fb63

Secondly, dropdown list is show, whereas button is selected.

https://www.kochkistl.at/collections/all/products/beiried-mit-zwiebeln

Please advise.

Urs

[Gabe]

Hey Urs! @KochKistl 

Übrigens wir bieten auch Support in der Deutschen Sprache hier im Forum fall dir das lieber ist. But English is no probs either. 

Thanks for the sticky cart link. Those sure look like some tasty hot meals there! : ) 

You say "icon does not show". Can you elaborate on what you mean by that exactly, Urs? Here's what I see:

Then you say "dropdown list is show, whereas button is selected." I must apologize but I am not sure I understand what you mean by that. Is there a missing options drop-down list on the product page you linked? This is currently what I can see:

I'll await further details so we can continue to troubleshoot any issues you are experiencing.

Best,

[KochKistl]

Ok, Gabe! Thanks for the swift answer.

English is just fine with me.

Now please take a look:
when you open this link

https://www.kochkistl.at/collections/all/products/beiried-mit-zwiebeln

our icon on the tab shows, like this:

KochKistl Icon on tab

However, when you open checkout:

https://www.kochkistl.at/51022725298/checkouts/5f2d17e4f4c3934b914ad46be290fb63

Icon doesn't show:

Weird.

Moreover,
we set the quantity selector in our brooklyn theme to button, not to dropdown,  however, dropdown is what we get:

Please, take a look:
https://www.kochkistl.at/collections/all/products/beiried-mit-zwiebeln

We have looked all over the source and couldn't find the reason why.
Thanks for your advice in advance.
Urs

[Gabe]

@KochKistl 

Thank you for the screenshots, Urs, which clarified a lot about the favicon and your quantity selector. I have created a short video on that here where I explain some of the system behaviour and I also reproduce the issue that you are seeing in my own test shop - such as that the favicon only reaches as far as where theme is active, and not as far as the checkout.

Regarding the Quantity Selector, this is what I see on my Google Chrome Browser and it is an up-down arrow, not a drop-down. Is that not what you are expecting? If you are seeing something else, what Browser are you using?

[KochKistl]

Hi, Gabe!
Thanks for the swift answer.
We always use the newest version of Google Chrome, and yes, you are right, it is an up-down arrow.
It used to be a button with a plus sign to the right and a minus sign to the left.
Up-down arrows are not so self-explanatory as buttons.

How do we get our buttons back?

Is it possible that one of our apps overrides the default settings?
Thanks again.

Regards,

Urs

[Gabe]

Hey Urs! @KochKistl 

I see what you mean now and I found the issue. The quantity selector that you mean is not part of the theme and seems to come from an app. Let me show you what I mean.

Below is the button you mean and it's on a different page coming from an app (Bundles?):

• See the demo of the button here

The Page URL is kochkistl.at/apps/bundles/bundle/60586 and so you can see this button is made by an app and not by the theme. The page Inspect tool points to the Bundle Builder App:

Does that answer your question? 

[KochKistl]

Hi Gabe!
Well, you were absolutely right, however we are preparing a second solution, because the bundle builder app doesn't seem to forward SKUs for single items in bundle,
and we need that no matter what for logistics.
One recipe - many components - needs to be "de-bundled" for purchase orders and commissioning.

Here the link for our alternative: https://www.kochkistl.at/collections/all

And here the quantity selector is not what we want. We used Chrome DevTools of course to make sense of what is happening, many hours, to no avail.

Perhaps you could come up with a solution..?

Thanks for your swift answers and the videos, very much appreciated!
Best regards,
Urs

[Gabe]

Ah gotcha! What you need is a bundles app that also manages the individual items inventory, SKUs etc. The Bundles App can do that AFAIK. Give it a try?

[KochKistl]

Gabe, one more thing for now:

Desktop view: hero page elements show in perfect order;

Mobile view not so. hero page elements slider, picture, text block and so on.

It should be slider, text block, picture and so on.

How do we change that?

Thanks again.

Urs.

[Gabe]

Hey Urs! @KochKistl 

Thanks for the details. Let me first recap what you said here and then do some troubleshooting together with your good self:

Desktop view - the sections show in perfect order. They are the following:

1. Hero Slider ("Du kochst mit Leidenschaft")
2. Text and Image 1 ("Nur die beste Qualität, von vertrauensvollen Partnern")
3. Text and Image 2 ("In 3 einfachen Schritten zu tollen Kochboxen mit allen nötigen Zutaten")
4. Text and Image 3 ("Nachhaltig, hygienisch & gekühlt verpackt")
5. Featured Collection ("Rezepte der Woche")

ISSUE on Mobile

The above section sequence is not being reflected on mobile, is that correct?

I tried to reproduce what you say but I got the exact same sequence on my Galaxy Note 20 Ultra as you can see in this screen recording .gif below. Is that what you mean? Send me more details in case I got it wrong, Urs.

See here:

[KochKistl]

Hi Gabe!

Desktop:

Hero page:

Slider -> text left aligned -> picture

picture -> text

Mobile view:

Slider -> picture -> text -> picture -> text and so on

AND NOT:

Slider -> text -> picture -> text.

Two pictures on the hero page entrance of mobile version is not what we like to have -> BDUs

Regards,
Urs

[Gabe]

@KochKistl 

Have you tried other themes to see what behaviours and properties they have? Many themes are different in the way they show the presentation layer.

With your current theme, what you see on mobile is the expected theme behaviour and any changes on the mobile view only would require a lot of coding. Have you spoken to any experts about getting somebody to program the mobile theme code for you? If not there is one I highly recommend and who does good work for cheap -> www.taskhusky.com.

Drop them a line and see what they suggest as the best mode of action?

[KochKistl]

Hi Gabe!
Thank you very much!
We decided to develop a theme of our own with Shogun on a KochKistl clone on my partner's Shopify Partner account.
But first we need to get our infrastructure right.
Meaning:
- getting our SKU problem solved & streamlined -> Pick, Pack and Promo seems to be the right app here;

The only thing that won't do - for the time being - is this:

This is a no-go for mobile devices, it used to be plus and minus buttons - BDU safe - and we cannot find the cause of this in our AJAX code...

Thank you very much again for your great support!
Regards,
Urs

[Gabe]

@KochKistl 

By BDU you mean? But yes, that sounds like a plan to have a really great Storefront and you are really putting the customer experience first!

I can fully understand that the Qty Selector on mobile isn't great but tbh, I found the UX ok as you can see below: 

Tip: As you offer food, your customers need regular deliveries and replenishments right? Have you thought about offering Subscription payment options to your customers?

• See more on that here.

Best,

[KochKistl]

Hi, Gabe!
Just one more question, please take a look:
https://www.kochkistl.at/

Shopify cart shows a red dot, however cart is empty.

How do we change that, if empty no red dot?
Thanks a lot for your efforts like always.
Best regards,

Urs

[Gabe]

@KochKistl 

Hey Urs! Ask as many questions as you like - that's what I'm here for! : )

So the expected system behaviour and reason the cart icon is 'USUALLY' showing the red dot is because you still have a product (or more) in the cart. When you browse the shop and you put a product into the cart, the cart sets a persistent browser cookie in your browser settings that remembers your products from a previous browsing session.

However in your Shop there is something wrong (as you can see in my short video here). QQ: have you changed anything in the code?

What I suggest is you send that to our theme team and they will take a look. Please send us a ticket here and that will be forwarded to our theme team. Also please include a video that shows the issue or even use my video for your ticket to our theme team.

[KochKistl]

Hi, Gabe!
Actually we changed a lot of things in the code.
But that is not so important for now, it's cosmetics.
We use bundle builder for our shop, so never mind.
One thing is odd, though: https://www.kochkistl.at/

In HTML:
"<h2 style="text-align: center;">Die beste regionale Qualität von vertrauensvollen Partnern</h2>
<p style="text-align: center;">Fleisch, saisonale Gemüse, Milchprodukte, Eier, Nudeln, Pilze und viele andere Produkte: Im KochKistl findest du beste Tiroler Qualität&nbsp;von vielen&nbsp;regionalen Landwirten und Produzenten.</p>
<p style="text-align: center;"><a href="/pages/unsere-partner" class="btn">Mehr erfahren</a></p>"

Where does the red line come from?
Best regards,

Urs

[Gabe]

@KochKistl 

Ok please include that in your ticket as I won't really be able to do an in-depth root-cause analysis. Unless Mario @r8r, you might have an idea? It could have something to do with the theme colour settings. See it on the HP here:

[KochKistl]

Dear Gabe, thank you very much so far!

There is one other thing I cannot wrap my head around, please take a look:

https://www.kochkistl.at/collections/all

Page one:

Page two:

Where does "

Spoiler

<a class="grid-product__image-link" href="/collections/all/products/beiried-mit-zwiebeln" data-image-link="">

<style>

@media screen and (min-width: 591px) {
.ProductImage-15759048310962 {
max-width: 310px;
max-height: 174.375px;
}
#ProductImageWrapper-15759048310962 {
max-width: 310px;
}
}

@media screen and (max-width: 590px) {
.ProductImage-15759048310962 {
max-width: 590px;
}
#ProductImageWrapper-15759048310962 {
max-width: 590px;
}
}

</style>

<div id="ProductImageWrapper-15759048310962" class="product--wrapper">
<div style="padding-top:56.25%;">
<img class="product--image ProductImage-15759048310962 lazyautosizes lazyloaded" data-widths="[180, 370, 590, 740, 900, 1080, 1296, 1512, 1728, 2048]" data-aspectratio="1.7777777777777777" data-sizes="auto" alt="" data-image="" data-srcset="//cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_180x.jpg?v=1613294261 180w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_370x.jpg?v=1613294261 370w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_590x.jpg?v=1613294261 590w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_740x.jpg?v=1613294261 740w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_900x.jpg?v=1613294261 900w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1080x.jpg?v=1613294261 1080w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1296x.jpg?v=1613294261 1296w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1512x.jpg?v=1613294261 1512w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1728x.jpg?v=1613294261 1728w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_2048x.jpg?v=1613294261 2048w" sizes="309px" srcset="//cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_180x.jpg?v=1613294261 180w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_370x.jpg?v=1613294261 370w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_590x.jpg?v=1613294261 590w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_740x.jpg?v=1613294261 740w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_900x.jpg?v=1613294261 900w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1080x.jpg?v=1613294261 1080w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1296x.jpg?v=1613294261 1296w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1512x.jpg?v=1613294261 1512w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1728x.jpg?v=1613294261 1728w, //cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_2048x.jpg?v=1613294261 2048w">
</div>
</div>
<noscript>
<img class="grid-product__image" src="//cdn.shopify.com/s/files/1/0510/2272/5298/products/KochKistl_BeiriedmitRoesti_Rezeptblatt_800px_1024x.jpg?v=1613294261" alt="">
</noscript>

</a>

come from...?

Why is it , that the exact same sized pictures with the exact same template in products are different in display?

Thanks again,
best regards.
Urs

"

[Gift-o-the-Jab]

Hey @KochKistl 

Can you give some more details as to what you mean - that some images have different aspect ratios? All I see is this.

All images do not seem to have the same dimensions either as you can see in your code: