Skip to content

Instantly share code, notes, and snippets.

@megane9988
Created July 21, 2013 20:41
Show Gist options
  • Save megane9988/6049892 to your computer and use it in GitHub Desktop.
Save megane9988/6049892 to your computer and use it in GitHub Desktop.
ソーシャルボタンを自作する際のリンク指定
<div class="socialbigbt">
<a class="twitter_button" href="
https://twitter.com/intent/tweet?original_referer=<?php the_permalink(); ?>&text=<?php echo the_title(); ?>&tw_p=tweetbutton&url=<?php the_permalink(); ?>
">twitterでつぶやく!</a>
<a class="facebook_button" href="http://www.facebook.com/sharer.php?u=<?php the_permalink(); ?>/&t=<?php echo the_title(); ?>" target="_brank">facebookでシェア!</a>
</div>
------
/*ソーシャルボタン*/
.twitter_button {
font-size: 14px;
padding-top: 15px;
padding-right: 80px;
padding-bottom: 15px;
padding-left: 80px;
text-decoration: none;
-webkit-border-radius: 28px;
-moz-border-radius: 28px;
border-radius: 28px;
-webkit-box-shadow: 0px 1px 3px #666666;
-moz-box-shadow: 0px 1px 3px #666666;
box-shadow: 0px 1px 3px #666666;
text-shadow: 0px 1px 3px #666666;
border: solid #e02479 2px;
background: -webkit-gradient(linear, 0 0, 0 100%, from(#fc3f94), to(#fc0574));
background: -moz-linear-gradient(top, #fc3f94, #fc0574);
-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#fc3f94, endColorStr=#fc0574);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#fc3f94, endColorStr=#fc0574);
display:inline-block; /* IE is so silly */
}
.twitter_button:hover {
background: -webkit-gradient(linear, 0 0, 0 100%, from(#fa3f8a), to(#ff40a9));
background: -moz-linear-gradient(top, #fa3f8a, #ff40a9)
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#fc3f94, endColorstr=#fc0574);
}
.main a:link.twitter_button {
font-family: Arial;
color: #ffffff;
}
.facebook_button {
font-family: Arial;
color: #ffffff;
font-size: 14px;
padding-top: 15px;
padding-right: 80px;
padding-bottom: 15px;
padding-left: 80px;
text-decoration: none;
-webkit-border-radius: 28px;
-moz-border-radius: 28px;
border-radius: 28px;
-webkit-box-shadow: 0px 1px 3px #666666;
-moz-box-shadow: 0px 1px 3px #666666;
box-shadow: 0px 1px 3px #666666;
text-shadow: 0px 1px 3px #666666;
border: solid #255ade 2px;
background: -webkit-gradient(linear, 0 0, 0 100%, from(#4599ff), to(#3f64fa));
background: -moz-linear-gradient(top, #4599ff, #3f64fa);
-ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#4599ff, endColorStr=#3f64fa);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#4599ff, endColorStr=#3f64fa);
display:inline-block; /* IE is so silly */
}
.facebook_button:hover {
background: -webkit-gradient(linear, 0 0, 0 100%, from(#5476ff), to(#264aff));
background: -moz-linear-gradient(top, #5476ff, #264aff)
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4599ff, endColorstr=#3f64fa);
}
.main a:link.facebook_button,
.main a:visited.facebook_button{
font-family: Arial;
color: #ffffff;
}
.socialbigbt{
text-align: center;
margin-bottom: 30px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment