How Remove GooglePlus "+1" Sharing button from mobile view?


#1

Hello,

I have edited out other options and ‘Show Share Buttons’ is disabled, yet I can not figure out how to remove this:

Would appreciate if someone could help me in removing the +1 button from the mobile view of my blog.

Thanks, Steve


#2

Use tag conditional:

<b:if cond='data:blog.isMobile != &quot;&quot;'>
<your tags or JS goes here>
</b:if>

#3

I appreciate the conditional tag, however it is not completely useful. Would you indicate where it is to placed?


#5

It’s and exception code, the code I give is:

The button will show on desktop only, but not showing on mobile.


#6

I tried the conditional code with no resolution as I was not sure, nor was it indicated how to implement it. As indicated from the original post, I wanted to know how to remove it not supply a conditional or other remedy.

I did however find a solution that works by removing the following code:

<div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>

Thanks Steve


#8

Do not take this wrong way.

The original post clearly stated -

From original post:

Screen shot visually indicating the question of what needs to be removed.

“Would appreciate if someone could help me in removing the +1 button from the mobile view of my blog.”

===========

What was requested was clearly stated. A conditional statement was never requested, nor was a solution for adding the +1 button - so to answer directly, no - neither of these options answered or helped as there did not pertain to the topic of the request.

I have one closing question and one closing thought.

Closing question: If my question was not clearly understood, why was an assumption made instead of asking for clarification?

Closing thought: Do not mistake what I have said or my tone, it is not meant in a negative way - it is meant as constructive feedback.

Thanks, Steve


#9

humble apologies just missed replying your question. Dozen questions asked daily so old questions are often missed

Removing HTML elements from Mobile View

Instead of removing HTML containers from the template you can instead block the widget from displaying in mobile view by adding a simple CSS style by following these steps.

  1. Visit your blog in http://mobiletest.me/
  2. Then right click the widget you don’t want on your blog and then choose the “Inspect Element” option in Chrome or Firefox
  3. Look closely what is the ID name or class of the element. Like in your case it is .goog-inline-block which is a class.
  4. Once you know the ID or class then simply block its view using the following code
  • Paste the following just above </b:skin> inside your template

    .mobile .goog-inline-block {display:none!important;}

What @Mad suggested using the conditional tag does a similar thing but yes you are right he should have mentioned the details which could have been more helpful. :smiley:

Remember that classes are preceded with a dot and IDs are preceded with a # sign. If your HTML container contained ID then it would look like this:

<div id='goog-inline-block'><data:post.dummyTag/></div>

and inside CSS you would preced it with a # sign. i.e #goog-inline-block


#10

Sorry dear @InfernalWriting & @Mohammad , I’m was too busy handling my blog. :dizzy_face:


#11

thank you, interesting to know, many thanks :slight_smile:


#12

Hi, Is it possible to remove it from Blogger Default mobile template? Please suggest. Thanks in advance.


#13

Thanks… it helped… I’m Working on a Private Blog but I don’t want it to be restricted to Registered member. Thanks a lot for the tip on Hiding the G+ Button on mobile.