I can’t figure this out. I’m building this HTML link in WP using Shortcoder (HTML below) and a self created plugin to create a shortcode (PHP below) and CSS to create the button (CSS below).
The problem is that the shortcode, [upo_url_shortlink] (php below) is showing up (echoed) on top of the page instead of being used by the link (&url). Everything else is in place. The short url used is generated by Short URL and the url that is echoed is the correct one. It is just not used by the button link…
Example page: http://www.behind-the-scenes.co.za/Ib0Lf
Can someone please see what I’m doing wrong?
<span class="upo-share-buttons"><a href="https://twitter.com/intent/tweet?text=[types field="twitter-text" output="raw"][/types]&url=[upo_url_shortlink]&via=RenierDelport &hashtags=[types field="visitor-twitter-hashtags" output="raw"][/types]" target="_blank" title="Share [wpv-post-title] on Twitter"><i class="fa fa-twitter fa-2x"></i></a></span>
// [upo_url_shortlink]
function upo_url_shortlink_function() {
echo wp_get_shortlink();
}
add_shortcode('upo_url_shortlink', 'upo_url_shortlink_function');
.upo-share-buttons {
display: inline-block;
border-right: 2px solid white;
width: 40px;
line-height: 40px;
padding: 5px;
position: relative;
background-color:#ff0000;
text-decoration: none;
text-shadow:0px 1px 0px rgba(0,0,0,0.5);
-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true)";zoom:1;
filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=1,Color=#ff123852,Positive=true);
-moz-box-shadow:0px 2px 2px rgba(0,0,0,0.2);
-webkit-box-shadow:0px 2px 2px rgba(0,0,0,0.2);
box-shadow:0px 2px 2px rgba(0,0,0,0.2);
-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true)";
filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=0,OffY=2,Color=#33000000,Positive=true);
}
.upo-share-buttons a:link, .upo-share-buttons a:visited {
color: white !important;
}
.upo-share-buttons a:hover {
color: #eeeaee !important
}
You should be returning your output not echoing it. try changing your shortcode to…
Hope that helps
Dan