wordpress 固定ページの内容を表示するソース

$page_id = xxx; //xxxに 固定ページIDを入力
$content = get_page($page_id);
echo $content->post_content;
?>

Wordpressで47都道府県をカテゴリーとして一括登録するときのフォーマット

Wordpressで47都道府県をカテゴリーとして一括登録するときのフォーマット
プラグインBatch categories importを使用するとき。

»続きを読む

fancyboxをもっとお洒落にする方法

jqueryのlightboxというと、
colorboxかfancyboxをよく使うのですが、
このfancybox、画像もHTMLも色々ポップアップできるし、サクサク動くし、設定もラクチンで大好きなのですが、
オリジナルデザインにカスタムしまくれちゃうってご存知でしたか?

ボタンや画像類は変えられるのは分かるけど、
枠のデザインまで好きにできるんですね!!


fanceboxの枠のID.jpg


ちょっと抜粋なので、そのまま使えなくて申し訳ないですが、
分かる方には分かるかと・・・(というより未来への自分へのメモだし)



/* 上 */
#fancy-bg-n {
    background-image: url('fancy-bg-n.png');
    background-repeat:repeat-x;
}
/* 右上 */
#fancy-bg-ne {
    background-image: url('fancy-bg-ne.png');
}
/* 右 */
#fancy-bg-e {
    background-image: url('fancy-bg-e.png');
    background-repeat:repeat-y;
}
/* 右下 */
#fancy-bg-se {
    background-image: url('fancy-bg-se.png');
}
/* 下 */
#fancy-bg-s {
    background-image: url('fancy-bg-s.png');
    background-repeat:repeat-x;
}
/* 左下 */
#fancy-bg-sw {
    background-image: url('fancy-bg-sw.png');
}
/* 左 */
#fancy-bg-w {
    background-image: url('fancy-bg-w.png');
    background-repeat:repeat-y;
}
/* 左上 */
#fancy-bg-nw {
    background-image: url('fancy-bg-nw.png');
}


上、下、右、左と、その四隅にみんなIDがついてるんですね。

それぞれに背景画像を指定してやれば、

 ↓ こんな感じで、額縁のようなデザインも可能になっちゃうのです。


fanceboxの枠改修後.jpg


ちなみに、IEは8以下で、画像が表示されないバグがあるので、
ハックとして、

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://xxxxxxx/fancy-bg-n.png', sizingMethod='scale');

↑ こんな風に絶対パスが書き加えないといけないのですけどね。
テスト機と本番機で書きえたり、面倒だけど。。。
IE6、7はだいぶ除外されてきてるので、8さえどけば・・・!!!ですね(-_^)

SNSボタン設置

<a href="https://twitter.com/share" class="twitter-share-button" data-via="hpstylelink" data-lang="ja" data-hashtags="web制作">ツイート</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

<a href="https://www.facebook.com/sharer/sharer.php?u=http://google.com" target="_blank">
診断結果をFacebookでシェアする
</a>

<a href="http://line.me/R/msg/text/?LINE%E3%81%A7%E9%80%81%E3%82%8B%0D%0Ahttp%3A%2F%2Fline.me%2F">LINEで送る</a>

Wordpressの新着記事をサイトトップページなどに表示するおまじない

<?php require_once('wp-load.php'); ?>
<!doctype html>
<html>

をHTMLの上部にいれて、.htmlでなく.phpで保存
文字コードはutf-8

»続きを読む

スマホ、タブレットで表示倍率1倍で表示したいが拡大・縮小は認めたいviewport設定

スマホ、タブレットで

表示倍率1倍で表示したいが
拡大・縮小は認めたい

<meta name="viewport" content="width=device-width,initial-scale=1.0">

文字のサイズを固定化したいなら、
CSS に次のように指定しておく。

body {
  -webkit-text-size-adjust: 100%;
}

「スマートフォン用サイトを表示しますか?」と尋ねてくれるアレ。

スマホとPCでサイトを見たときに
それぞれ用のサイトの切り替えをしたいときにコード

<script type="text/javascript">
// iPhoneまたは、Androidの場合は振り分けを判断
if (document.referrer.indexOf('本サイトのアドレス') == -1 && ((navigator.userAgent.indexOf('iPhone') > 0 && navigator.userAgent.indexOf('iPad') == -1) || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0)) {
if(confirm('スマートフォン用サイトを表示しますか?')) {
location.href = 'スマホサイトのアドレス';
}
}
</script>


参照
「スマホとPCでサイトを見たときにそれぞれ用のサイトの切り替えをしたいときにコード」
http://ameblo.jp/nanaign/entry-11568811100.html

アメブロ 署名

アメブロで、記事ごとにランキングバナーとか貼るの面倒ですよね。
記事下に自動挿入、署名とかで色々検索してみると、ありました。

フリープラグインに入れる

<script type='text/javascript' src='http://stat100.ameba.jp/blog/js/apm001.js'></script>
<script type="text/javascript">
$(function(){
var et01w ='<p class="et01">ここに署名として入れたいバナーなどのタグを入れる</p>';
$(".articleText").after(et01w)
});
</script>

注意:
ここに署名として入れたいバナーなどのタグを入れる部分に改行を含まないこと。
改行したい場合は<br>タグを使うこと。

参照:http://ameblo.jp/wanko-to/entry-11160809475.html

Wordpressブログ→Facebookページ連動(自動投稿)

WordpressブログからFacebookページに連動させ、ウォールに自動投稿させる方法は、色々あります。
Wordpressのプラグインで、「Facebook」というプラグインや、
「Wordbooker」というプラグインなど、色々試してみました。
しかし、あちこちつまずく点があり、断念。。。

視点を変え、
Wordpressブログ→twitter→Facebookページ連動(自動投稿)
というように、ツイッターを介す方法でやってみることに。

facebook_twitter_wp.gif


◆Wordpressブログ→twitter

これは、「Simple Tweet」というプラグインを使用。
参照→http://wppluginsj.sourceforge.jp/simple-tweet/

※テストのときの注意
Wordpressでテスト投稿するときは、ちゃんと現在の時間で、新規投稿した方がいいみたいです。
過去の時刻にして新規投稿したり、過去の記事を下書きにして再公開したりしても、ちゃんと反映されませんでした。
公開済みのサイトでテストするときは、クライアント様の許可をとって作業しましょう。


◆twitter→Facebookページ連動

twitterの「設定」→「プロフィール」の下部に、
「facebook」と連携させる箇所があります。
facebook_twitter.gif

ここは、チェックをつけたり外したりするたび、設定変更が保存されている模様です??
設定を保存するボタンが、アクティブにならないので、すごい違和感を感じるんですよね。。。

※設定完了での注意
一度twitterをログアイトして、再ログインして
設定内容に間違いがないか確認できたらOKです。
これをやらないと、元に戻っていたりします。


これで、
Wordpressブログ→twitter→Facebookページ連動(自動投稿)
繋がったはずです☆

カラールックアップ調整

スマホを持つようになり、
すっかりinstagramの恩恵ばかり受けている毎日です。

おかげで、Photoshopの補正スキル落ちてきてるんじゃないかとヒヤヒヤしますね。

しかも、CS6になってから、
またすごい機能ついてること知りました。

カラールックアップ調整

ていうんですねー。

サンプルをいろいろ置いてみますねー。
Before(写真)
2013-01-18-18.44-1.jpg
After(カラールックアップ調整のバリエーション)
3パターンほど・・・
2013-01-18-18.44-3.jpg
2013-01-18-18.44-2.jpg
2013-01-18-18.44-4.jpg
カラールックアップ調整
「レイヤーメニュー」から「新規調整レイヤー」>「カラールックアップ調整」を選びましょう。上の画像のように多種多様なエフェクトがあるので、好きなものを選択すれば出来上がりです。あくまで「レイヤー」なので、データそのものを改変せずに効果をかけられます。納得いくまで試しましょう。 参照:Photoshop CS6ならInstagram風エフェクトが簡単にかけられる
前の10件 1  2  3  4  5  6  7  8  9  10  11