How to fix mobile viewport meta tag?

[lyudmylam2006]

I bad in computer.How to fix mobile viewport?

Where to add special header code provided by ebay?Inside listing or somewhere else?

Thank you for your help!

[shipscript · Accepted solution]

@lyudmylam2006

Your listing has three areas of concern:

http://www.ebay.com/itm/191920337389

1) Mobile Friendly: Will it display correctly on a mobile device?

It would display just fine if you did not have that old version of the Auctiva gallery at the top. That gallery does not change shape to fit on a mobile device, so it will set the width of the page.  The mobile device will shrink everything, including text, to fit that gallery onto the screen. For mobile friendly, use widgets that are responsive (change shape), and then add this line of code to the top of the HTML view of your description.

  <meta name=viewport content="width=device-width, initial-scale=1">

2) Mobile Summary:  eBay will pull some text out of your page and put it on the mobile device as a short summary. The user can still click through to your description, but many will just read the summary. So it is important that eBay picks up the best text for the summary. If you have only plain text in your listing, eBay will pick up the first sentences. If you have a lot of custom HTML code, like your Auctiva gallery, the text that eBay picks up may not be the text you want displayed. To solve that problem, eBay has provided codes to add to your description that encloses the words you would like in the summary.

You would add this code to the HTML view of eBay's description editor. However, eBay is not yet picking up this code, so it won't go into effect until later:

<div vocab="http://schema.org/" typeof="Product">
<span property="description">
...your description summary goes here...
</span></div> 

3) Active Content:  Starting middle of 2017, eBay will begin blocking active content, including javascript and promo galleries, like your Auctiva Gallery. As you create new listings, decide whether you want to include those widgets if you have to remove them later. It is fine to keep them in your listings through the Christmas selling season, but then decide how and when you want to eliminate them.  eBay has a link in your own listings for you to view your page as it would look with the ban in place. You can also use this tool to look for the problem codes and remove them.

http://www.isdntek.com/ebaytools/ActiveContentSandbox.htm

[lyudmylam2006]

Thank you very much!

[rock-on-collectibles]

We have had all kinds of various problems with the description not rendering correctly on various browsers and differences on MAC and PC. We found that our listings didn't render correctly using Chrome (PC or MAC) or Safari (MAC) - but the listings DID render correctly using Firefox, Internet Explorer, Sea Monkey and the eBay mobile app.

Then we discovered that eBay at some point in the last couple of weeks updated the "meta tag" that they had in the section explaining how to update your listing. The revised page can be found here:  http://pages.ebay.com/sell/itemdescription/mobilefriendlyguidelines.html

This is the updated code they currently have posted today, August 12th, 2016: 

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no”>

We update several listings as a test and it corrected the problem on all that we tested.

Of course they should have indicated on that page that the code was udpated - so that sellers don't spend hours trying to troubleshoot.

Having said all of this, we are actually going back in to our listings and removing all the code until we know for sure that the revised code is the final version that will work across all platforms.

Hope this helps.

[camera_values]

@shipscript

Hi shipscript & greetings from the UK PS board and MANY thanks for your suggestions.

We have all been suffering with these problems as well.

eBay have kindly given us access to a tool to show which of our items are going to be 'non-comliant' under the new rules and currently, that would be ALL of them. 😞

The tool gives us a list of the individual 'problems' but no proper explanation of how to fix them - unless you have a degree in computing and gobbledygook, that is.

I tried your first suggestion on one of my items & presto! It worked. 🙂

Now I'm only 50% 'non-compliant' instead of 80%.

Thnaks so much & I have post a link on the UK board so hopefully your kudos will increase.

Regards

Tim

camera_values

[shipscript]

@rock-on-collectibles

Thank you for this info.  I am a bit mystified by the meta tag change that would prevent users from scaling (zooming) the page. Since you have so many browser versions, I would love to have you test a few things if you ever have time. Please let me know.

Also, your listings that I viewed look pretty simple. I can't imagine them failing to render on mobile. Was it only after you added the first meta tag that they failed to render correctly?

[shipscript]

@camera_values

Thank you for posting here. Have you tried this tool to help identify and remove Active Content in a single listing?

http://www.isdntek.com/ebaytools/ActiveContentSandbox.htm

It looks like all of your listings have a promo gallery (marked in pink), so when it comes time to be compliant, you will have to remove that promo gallery from all of your listings. 

Your listings also have links back to your store, which currently won't work unless eBay changes the Active Content filter, so they are marked in yellow until we find out how eBay will resolve those. (By the way, I got a message back from eBay this morning that they recognize the link problem and will try to find a solution because they understand store links are very important).

[camera_values]

@shipscript

Hi again shipscript & thank you for the link to that tool - VERY informative, even for someone with basic HTML/computing know-how like me & SO much quicker than the link eBay UK are sending out which takes about 30 seconds. Your tool shows what is going to be 'non-compliat' and why AND gives an idea of how to fix it. 😄

Now, why can't eBay tell us the same? 😞

BTW The scrolling gallery should sort it's self out as the company many of us in the UK use is working on a fix.

Thanks again,

Tim

(UK)

[rock-on-collectibles]

@shipscript

The first meta tag that eBay published caused all of our listings to NOT render correctly while viewing on a computer, but only in certain browsers on both a MAC and PC (Chrome and Safari).

They would view properly in Firefox and IE though - which kind of make sense since both Chrome and Safari block certain plug ins.

All of the listings DID render correctly on our Androids, iPhones and iPads using the eBay App - this seems to be a computer challenge.

When we substituted the newly updated code for the previous code it rendered correctly for the majority of our listings. But then we discovered that some of our older listings that had Auctiva gallery on the bottom - still didn't render correctly. So we removed the Auctiva gallery and it worked. But then....we discovered that some our listings that had the created by Turbo Lister logo on the bottom - weren't rendering correctly either.

So...now I have my team removing all the junk on the bottom of over 4000 listings AND removing any code for mobile viewport at the top.

Here is an example of a listing that hasn't been fixed yet that still has the original code at the top and viewed in Safari and Chrome on a Mac:

http://www.ebay.com/itm/COUNTING-CROWS-97-RECOVERING-SATELLITES-TOUR-POSTER-/311643676594?hash=item4...

You will see that it only gives the first line of text and in Chrome, the there is a scroll box directly to the right of text where you can scroll through the entire description but just one line a time. (see attached)

I spent a stupid amount of time on the phone with eBay tech support and they were not very helpful in understanding the issue. I had all of my staff test various listings on their home computers even - and it was the same problem.

So Friday we had a team meeting and decided that for now - until eBay has a definitive solution that works, we are removing all codes - even the updated one. Our thought was if we (as novice computer users) have found this many inconsistencies with both codes - then most likely there will be another update or new solution all together. We have over 4000 listings to change and so far we have changed them 2 x - that's alot of down time for my staff, not to mention sales - if a buyer cant see the description.

Does this help better explain our challenges?

[shipscript]

@rock-on-collectibles

Thanks for providing the listing, as that makes it simpler to locate problems.

I looked at the source code for this listing:

http://www.ebay.com/itm/311643676594

At the top, where the META tag was added, the ending quote in the meta tag is a "curly quote" instead of a straight quote. That symbol is then not recognized as a closing quote and all remaining HTML becomes part of the meta tag until another real quote is encountered.  I suspect that symbol, rather than the tag itself, may be the basis for the problems.

<font rwr='1' size='4' style='font-family:Arial'> 
    <meta name="viewport" content="width=device-width, initial-scale=1”>  
    <table cellpadding="0" cellspacing="28" width="100%">
    <tbody><tr>
        <td valign="top">

[rock-on-collectibles]

@shipscript

Okay so that worked.

My next question is which code should we use? The original code that eBay posted or the revised code that the posted in it's place?

Original:  <meta name="viewport" content="width=device-width, initial-scale=1">

Revised (current):  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

Is there a difference?

Thanks! 🙂

[shipscript]

@rock-on-collectibles

eBay had to have changed the code for a reason, otherwise they would have left it alone. My speculation is that it is required in some devices and possibly ignored in others.

There is a difference. The new one prevents user scaling of page contents. That sounds like a bad idea to me, but I don't have mobile devices to test.  The key would be whether a visitor viewing your page with scalable=no could zoom in on any area.  If the page is correctly designed to collapse to the smallest 320px device width, it may be a moot point, but actually seeing the performance would tell.  Without devices, I'm afraid I'm running blind on this one.

[rock-on-collectibles]

@shipscript

Thank you for all your help and input. 🙂

[nc-daydreamer]

@Dear @shipscript 

Wondering if you know (betcha do - you are good at this stuff!) since eBay is going mobile - can one (or should) use spoilers in their ads? Something like a q&a in a listing (which would make it shorter in length)... such as...

"Are you a drop-shipper.... {show}"

"Are the pictures posted of the actual item.... {show}

Whereas a viewer can click on the word 'show' to open a spoiler (I guess is the proper term to call it)? Example, it would open a paragraph to see the answer?  I hope I am making sense.  How to use/code such a feature? I've been experimenting for hours tonight and am now giving up and defering to your expertise 🙂

I have used the new link found on the listing/revising pages as of today on adding the meta tags such as you described here - cool idea, but the example results does not show displayed product pictures - will these be eliminated in actual use? (my phone is dumb, so I can't view it). And will this feature become part of the bulk editor - or will 1000 listings have to opened one by one to "check mobile"? Wish I were smarter on this stuff.

Thank you.

Wanda

[plummer602]

Thank You very much for this info!