How to move sharing buttons to top in Oxygen
-
Dear all:
I’d like to move all sharing buttons (social media, print, email, etc) to the top of posts AND pages.
How do I do that customizing CSS?
Thanks in advance !!
The blog I need help with is: (visible only to logged in users)
-
Hi there, I’m not seeing any sharing buttons on your posts. The following I worked up off of our Oxygen demo site.
div.sharedaddy .sd-sharing { position: absolute; top: 0; } .single .hentry { padding-top: 100px; }Let me know if this does what you are wanting.
-
Dear @thesacredpath:
Thanks !!
My sharing buttons are there, just above the tertiary menu / footer.
For sure, given the length of most pages, they are really hard to be found. That’s why I need to move them to the top !!
I’m going to try your recommendation and I will tell you how it worked.
-
Ah yes, I see them now. You may have to increase the top padding in the second rule to make room for them at the top since you have quite a few. The demo site had only a few on it.
-
Dear @thesacredpath:
It is a pity, but now the buttons overlap with titles.
See:
https://cambiocultural.org/trial/
Any ideas?
-
Sorry, I targeted only blog posts. Let’s change it to this instead. I’ve adjusted the padding so that there is no overlap now.
div.sharedaddy .sd-sharing { position: absolute; top: 0; } .hentry { padding-top: 150px; } -
Dear @thesacredpath:
I see your second post just now.
Do you think that by shortening the list of buttons the problem would be solved?
-
-
Ah !! I shortened the list and now there is too much space in relation to the title. Perhaps it is needed less than 150 px?
-
-
Dear @thesacredpath
I note that the “like” (“me gusta”) button did not move to the top. It stays at the bottom. Why does it happen?
-
Hi, we can move those also. I moved only the sharing buttons to the top since I thought that was all you wanted to move. There is something to consider though. As people click the “like” button, their gravatars will be added in a grid by the like button. If you get a lot of likes on a post, it will push those gravatars down and over the top of the title/date line, and possible down over the top of the content. Since you had mentioned moving the sharing buttons, I didn’t voice that concern. Here would be the code to move it all to the top. Replace what I had give with this.
#jp-post-flair { position: absolute; top: 0; } .hentry { padding-top: 175px; } -
Dear @thesacredpath
You have give me a very helpful advice, I’m going to think this now.
Many many thanks !!
-
- The topic ‘How to move sharing buttons to top in Oxygen’ is closed to new replies.