Adding share buttons in a post
-
Hi, Support sent me over to this forum.
My problem: Is there a way I can include a share button or two at the beginning of my posts? My posts are generally long, with references at the end, so that the share buttons at the end of the post are probably very rarely seen by the readers…
I do not talk nor write HTML-ish nor CSS-ish, so I need a user friendly advice. If anybody there is able to help, it would be great!The blog I need help with is: (visible only to logged in users)
-
Howdy einarflydal!
I created a code that will move all your share buttons right above your posts if that’s something you would like.
.sd-content{ position:fixed; top:50px; left:460px; }If this isn’t what you would like, you could create a linked image that you paste into the “HTML” section of your post, at the begging of each post. If this is more to your liking, I’ll write up a code for you.
-
Wow! Help came that soon!
Yes, I would like to try what you suggest. Where should the code be written? I never wrote HTML… -
Hey again!
Go to https://wordpress.com/customize/ → Click on CSS → Copy the code I provided above → Paste it into the CSS box → Click Save & Publish
Let me know if you run into any problems!
-
Well, it almost worked, but the positioning is wrong. Should be on the white area, i.e. more to the right. I suppose it means something should be done with the “left:460px;” statement. Any suggestion?
-
Fixed it by myself! Very proud…
Thank you so much for your help!
But the text remains fixed at the screen when I scroll down.
Could it be positioned at the top, so that it remains above the heading and dissappears upwards when scrolling down? -
Congrats on getting it! You now how some CSS works! :D
I am going to slightly change the code. Fixed was the wrong property to use. I changed it to absolute so the format is a bit different. Here:
.sd-content { position: absolute; top: 20px; } -
Well, you are flattering me. I tried, and added a line:
.sd-content {
position: absolute;
top: 20px;
left: 720px;
}
First, they seemed to disappear, as I was looking at the front page, not the bloggpost itself. Then I understood that mistake. But:
Now, the buttons appear in a column to the right…
Any suggestions? -
The position fixed works different to absolute.
The reason the icons a bunched up in a column is because the higher the number in left is, the further right it moves. Since you set it to 720px, it crunches everything to the right 720 pixels. Try lowering the number to 20px or similar.
-
Great. Issue resolved.
I understand it was a piece of cake, but not to one who is completely foreign to programming, even after a whole life in the ICT-business…
Thanks! -
You’re welcome! Don’t worry, you did great! Thanks for being patient and understanding. Happy blogging!
-
Hello again,
I just discovered that at the bottom of my posts, there is still the text “Del dette:”, i.e. “Share this:”. That text too should have been moved to the top – or deleted. Any suggestions? -
Howdy again!
If you would like it the text “Del dette:” moved to the top, use this code:
/* Share This */ .sd-title{ position: absolute; top: 5px; left: 20px; border-top: 0px !important; } body.highlander-light h3.sd-title::before { display: none !important;If you would like the text “Del dette:” deleted, use this code.
.sd-title{ display: none !important; } -
-
- The topic ‘Adding share buttons in a post’ is closed to new replies.