JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://wp-simplicity.com/wp-content/themes/simplicity-child-simplicity/style.css">
<meta property="og:title" content="Simplicityテスト all in one | blazechariot">
<div id="sns-group-top" class="sns-group sns-group-top">
<div class="sns-buttons sns-buttons-pc">
<p class="sns-share-msg">シェアする</p>
<ul class="snsb snsb-balloon clearfix">
<li class="balloon-btn twitter-balloon-btn"> <span class="balloon-btn-set">
<span class="arrow-box">
<a href="//twitter.com/search?q=http%3A%2F%2Flocalhost%2Fblog%2F%3Fp%3D489" target="blank" class="arrow-box-link twitter-arrow-box-link" rel="nofollow">
<span class="social-count twitter-count"><span class="fa fa-comments-o"></span>
<!-- <span class="fa fa-spinner fa-pulse"></span> --></span>
</a>
</span> <a href="//twitter.com/share?text=Simplicity%E3%83%86%E3%82%B9%E3%83%88&url=http%3A%2F%2Flocalhost%2Fblog%2F%3Fp%3D489" target="blank" class="balloon-btn-link twitter-balloon-btn-link" rel="nofollow">
<span class="icon-twitter"></span>
</a>
</span>
</li>
<li class="balloon-btn facebook-balloon-btn"> <span class="balloon-btn-set">
<span class="arrow-box">
<a href="//www.facebook.com/sharer/sharer.php?u=http://localhost/blog/?p=489&t=Simplicityテスト" target="blank" class="arrow-box-link facebook-arrow-box-link" rel="nofollow">
<span class="social-count facebook-count">9</span>
</a>
</span> <a href="//www.facebook.com/sharer/sharer.php?u=http://localhost/blog/?p=489&t=Simplicity%E3%83%86%E3%82%B9%E3%83%88" target="blank" class="balloon-btn-link facebook-balloon-btn-link" rel="nofollow">
<span class="icon-facebook"></span>
</a>
</span>
</li>
<li class="balloon-btn googleplus-balloon-btn"> <span...
JavaScript
(function ($) {
$(function () {
/*
* headOGPtitle headタグのog:titleの中身取得
* ogpUrlencode urlエンコード
* twitterLink twitterのリンクにurlエンコードしたタイトルを追加
*/
var headOGPtitle = $('meta[property="og:title"]').attr('content'),
ogpUrlencode = encodeURIComponent(headOGPtitle),
twitterLink = "//twitter.com/share?text=" + ogpUrlencode;
//console.log(headOGPtitle); //確認用
/*
* twitterHref twitterのアドレス部を取得
* hrefSplit twitterのアドレスをurl=で分割 リンクアドレスの取得
* 形式 twitter shareアドレス + urlエンコードタイトル &url= リンクアドレス
*/
var twitterHref = $(".twitter-balloon-btn-link").attr("href"),
hrefSplit = twitterHref.split("url=");
/*
* ここで.twitter-balloon-btn-link部のアドレス書き換え
*/
$(".twitter-balloon-btn-link").attr("href", twitterLink + "&url=" + hrefSplit[1]);
});
})(jQuery);