Originally coded for Bastion (and RDD, and possibly for Lunarfall)... why not share with rest : )
Copy the following code at the end of the index.template.php (before closing ofc)
function template_evil_social_share () {
// We have to be in boardIndex, messageIndex or Topic... otherwise no!
global $context, $board, $topic;
if (empty($_REQUEST['action'])) {
// Output what we have...
echo '
<div id="social_evil_buttons">
<a href="https://www.facebook.com/sharer.php?u='. $context['canonical_url']. '" class="facebook"><i class="fab fa-facebook fa-2x fa-fw"></i></a>
<a href="https://twitter.com/share?text='. $context['page_title_html_safe']. '&url='. $context['canonical_url']. '" class="twitter"><i class="fab fa-twitter fa-2x fa-fw"></i></a>
<a href="https://www.reddit.com/submit?url='. $context['canonical_url']. '" class="reddit"><i class="fab fa-reddit-alien fa-2x fa-fw"></i></a>
<a href="mailto:?'. $context['page_title_html_safe']. '&body='. $context['canonical_url'].'" class="mailto"><i class="fas fa-envelope fa-2x fa-fw"></i></a>
</div>';
}
}
Ofc the CSS part, add this to the end of your index.css file
/* Social Buttons -why not- */
#social_evil_buttons {
position: fixed;
left: 0;
bottom: 40%;
display: flex;
flex-flow: row wrap;
width: 3%;
}
#social_evil_buttons a {
padding: 15px;
display: block;
flex: 1 100%;
text-align: center;
}
#social_evil_buttons a i {
vertical-align: middle;
}
.facebook {
background: #4267B2;
}
.twitter {
background: #1DA1F2;
}
.reddit {
background: #ff4500;
}
.mailto {
background: grey;
}
And ofc the Responsive part...
@media screen and (min-width: 240px) and (max-width: 640px) {
/* Social Evil Something */
#social_evil_buttons {
bottom: 0;
width: 100%;
flex-flow: row nowrap;
}
#social_evil_buttons a {
padding: 10px;
}
}
Now you can use the function anywhere ... but I strongly advise to load the function inside template_html_below (before body closing)
Before you ask, this is also planned to be a modification... I just need some "good" time to make this into a mod (had to deal with all these hooks/settings etc...)
Note: This requires Font-Awesome by default to work properly, otherwise you need to change the icons & respected CSS parts
Remember if something is broken, its not my fault it was working last I checked... if its working good...
Snip licensed under: MIT
I tried this but it didn't work in my site. No social media buttons.
Probably you do not have Font Awesome loading in your template.
Possibly font awesome not loading....
add this before the </head> closing tag.
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" />
Hmm, I tested it on my site (my theme has FA) but it still does not work https://www.translatum.gr/forum/index.php
did you echo the "template_evil_social_share()" in your index.template :)
That is where it is on the template....
echo '
<script>
jq(document).ready(function () {
jq(".fsOpen").click(function () {
jq("input:text:visible:first").focus();
jq("body").css("overflow", "hidden");
});
jq(".searchButton").click(function () {
jq(".fullscreen.searchBar").css("display", "block");
});
jq(".loginOpen").click(function () {
jq(".fullscreen.loginBar").css("display", "block");
});
jq(".fullscreen .fsClose").click(function () {
jq(".fullscreen").css("display", "none");
jq("body").css("overflow", "auto");
});
});
</script>
<div class="sampleClass"></div>';
function template_evil_social_share () {
global $context, $board, $topic;
if (empty($_REQUEST['action'])) {
echo '
<div id="social_evil_buttons">
<a href="https://www.facebook.com/sharer.php?u='. $context['canonical_url']. '" class="facebook"><i class="fab fa-facebook fa-2x fa-fw"></i></a>
<a href="https://twitter.com/share?text='. $context['page_title_html_safe']. '&url='. $context['canonical_url']. '" class="twitter"><i class="fab fa-twitter fa-2x fa-fw"></i></a>
<a href="mailto:?'. $context['page_title_html_safe']. '&body='. $context['canonical_url'].'" class="mailto"><i class="fas fa-envelope fa-2x fa-fw"></i></a>
</div>';
}
}
echo '
</body></html>';
}
The fuction itself created so once I pack this as a mod, I dont have to do "template edit"... I can inject the func. into the template, you just need to echo (actually call the template) in your template file to work. For example; this is how I am calling it in Bastion theme;
function template_html_below()
{
global $context, $settings, $options, $scripturl, $txt, $modSettings;
template_evil_social_share();
echo '
</body></html>';
}
Right, so I got it, I had to put the chunk of code at the end of the template.
Now I get some errors, maybe escaping? The error points to the first line of index.template.php.
Failed to load resource: the server responded with a status of 500 ()
index.php:1 GET https://www.translatum.gr/forum/index.php 500
For some reason Twitter sharer seems to choke if the page title contains a pipe symbol. Maybe page_title_html_safe is not that safe?
https://www.translatum.gr/forum/index.php?topic=987994.0
<a href="https://twitter.com/share?text='. $context['page_title_html_safe']. '&url='. $context['canonical_url']. '" class="twitter" target="_blank" rel="noopener noreferrer nofollow"><i class="fab fa-twitter fa-2x fa-fw"></i></a>
I also added target="_blank" rel="noopener noreferrer nofollow" so that they open in new pages.
Tried adding linkedin too but it would always display the forum page (seems to choke on ?topic=)
<a href="https://www.linkedin.com/sharing/share-offsite/?url='. $context['canonical_url']. '" class="linkedin" title="Share in LinkedIn" target="_blank" rel="noopener noreferrer nofollow" ><i class="fab fa-linkedin-in fa-2x fa-fw"></i></a>
Interesting findings... I will take a look at them at first off-day...
Improved e-mail link by adding topic title as subject:
<a href="mailto:?subject='. $context['page_title_html_safe']. '&body='. $context['canonical_url'].'" class="mailto" target="_blank" title="E-mail this page"><i class="fas fa-envelope fa-2x fa-fw"></i></a>
working nicely with a few size adjustments
https://test2.turtleshellprod.com/index.php
I get multiple Undefined index: canonical_url errors all pointing to these three lines. Any idea?
==>938: <a href="https://www.facebook.com/sharer.php?u='. $context['canonical_url']. '" class="facebook" title="Share in Facebook" target="_blank" rel="noopener noreferrer nofollow" ><i class="fab fa-facebook fa-2x"></i></a>
939: <a href="https://twitter.com/share?text='. $context['page_title_html_safe']. '&url='. $context['canonical_url']. ' via @translatum" class="twitter" title="Share in Twitter" target="_blank" rel="noopener noreferrer nofollow" ><i class="fab fa-twitter fa-2x"></i></a>
940: <a href="mailto:?subject='. $context['page_title_html_safe']. '&body='. $context['canonical_url'].'" class="mailto" target="_blank" title="E-mail this page"><i class="fas fa-envelope fa-2x"></i></a>
That is probably page is not setting the said variable in that page, is there any example for it ?
Of course my friend. Well, it is not page-specific since it applies to the whole forum. Here is one:
https://www.translatum.gr/forum/index.php?topic=983795
8: Undefined index: canonical_url
index.template.php
Line: 940
It appeared in a missing topic page "The topic or board you are looking for appears to be either missing or off limits to you."
Apparently, that page does not have a canonical. So I guess the script should have an exception for error pages.
yea... Update the code like this...
if (empty($_REQUEST['action']) & isset($context['canonical_url'])) {
Yep, that did the trick :)