User Tools

Site Tools


doc:tips:sharebuttons

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision
Previous revision
Next revisionBoth sides next revision
doc:tips:sharebuttons [2020/06/05 19:39] arviddoc:tips:sharebuttons [2021/02/20 16:43] – [Alternative without images] lubomir_ludvik
Line 1: Line 1:
 +====== How to add social media share buttons ======
 +
 You may want to add share buttons for social media sites to your blog, so your visitors can easily share your content to their followers. You may want to add share buttons for social media sites to your blog, so your visitors can easily share your content to their followers.
  
 The following solution for that was originally provided by Panther [[https://forum.flatpress.org/viewtopic.php?f=4&t=144#p391|on the support forum]]. Thanks a lot! The following solution for that was originally provided by Panther [[https://forum.flatpress.org/viewtopic.php?f=4&t=144#p391|on the support forum]]. Thanks a lot!
  
 +===== 1.: Upload images =====
 At first, upload images for each share button you'd like to add. In our case, let's assume you create an ''sharebuttons'' folder in your FlatPress root. (Of course, you could store those images anywhere else within your FP instance). At first, upload images for each share button you'd like to add. In our case, let's assume you create an ''sharebuttons'' folder in your FlatPress root. (Of course, you could store those images anywhere else within your FP instance).
  
-Open ''fp-interface/themes/your_theme/entry-default.tpl'' in the editor of your choice and add the following to where you want your share buttons to be shown. +===== 2.: Add share buttons code to your theme ===== 
 +Open ''fp-interface/themes///your_theme///entry-default.tpl'' in the editor of your choice and add the following to where you want your share buttons to be shown. 
 (Change this code to your needs: Remove the buttons you don't need, or add more. Instead of the width and height attributes, you could also use CSS classes.) (Change this code to your needs: Remove the buttons you don't need, or add more. Instead of the width and height attributes, you could also use CSS classes.)
  
Line 43: Line 47:
 </code> </code>
  
-====== Alternative without images ====== +===== Alternative without images ===== 
-Panther altered his approach by using FontAwesome icons instead of images for the buttons. See this solution [[https://forum.flatpress.org/viewtopic.php?f=4&t=144#p413|on the forum]].+Tongara altered Panther'approach by using FontAwesome icons instead of images for the buttons. See this solution [[https://forum.flatpress.org/viewtopic.php?f=4&t=144#p413|on the forum]].<br> 
 +"[[http://flatpress.cz/fp-content/attachs/example%20font%20awesome.html|Share this:]]" with Awesome font in template  
 +[[view-source:http://flatpress.cz/fp-content/attachs/example%20font%20awesome.html|View-source]] and copy with .css link to entry-default.tpl 
 + 
 + 
 +===== Adding the "sharebuttons" code to Static pages ===== 
 +Tongara also posted a fix/update later on that would enable users to use the sharebuttons code on Static Pages. This was a very simple fix which works by placing the exact same code onto a static page template file (wherever the blog owner desires the share buttons to be displayed), and then finding any instance of 
 +<code> 
 +$id|link:post_link 
 +</code> 
 +And simply changing them to 
 +<code> 
 +$id|link:page_link 
 +</code>
doc/tips/sharebuttons.txt · Last modified: 2022/12/25 13:49 by arvid

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki