【WordPress】WPMLを使用する際ループで他言語の投稿の重複しないようにする方法

WordPressの多言語化対応プラグインWPMLで翻訳した記事がループ中で英語版と日本語版など重複して表示されるのを防ぐ方法です。公式のフォーラムに載ってました
続きを読む

Velocity.jsでCSSのプロパティと値を丸ごと変数にする方法

Velocity.jsでアニメーションさせるCSSのプロパティとその値を丸ごと変数に入れて動かす方法を調べました。

当初

<button class="btn">translateX:"+=100"</button>

となっているHTMLからjQueryで

var val = "{"+$(".btn").html()+"}";

として値を取得しそのままVelocity.jsで使おうとしていたのですが、動きませんでした。

以下のようにHTMLを変更し、splitで分割しブラケット記法にした変数に代入すると丸ごと変数を利用できます。

HTML

<button class="btn">translateX:+=100</button>

あとでブラケット記法にした変数に代入する際に自動的にクオーテーションが追加されるので値のクオーテーションをとりました。

JS

$(".btn").on('click',function(){
 
var opt = $(this).html().split(":");//コロンで値を分割して配列optに代入
var val = {};//ブラケット記法のための変数
val[opt[0]] = opt[1];//プロパティに対してその値を代入
 $(this).velocity(
 val ,
 "easeInSine",
 );
});

button要素をクリックすると、クリックしたボタンがX軸方向に100px移動します。

応用したサンプルはこちら

Mac OSのApacheで動作しているWordPressでアップデートをできるように設定する方法

Mac OS上のApacheで動作しているWordPressでアップデートをしようとするとファイルを上書きできずにエラーが出ます。
続きを読む

Facebookの投稿でMarkdown(マークダウン)記法を使う

いつの間にかFacebookの投稿でMarkdown(マークダウン)が使えるようになっていました。
以下の記法が使えるようです。
Facebook Markdown
続きを読む

Atomを使ったMarkdown(マークダウン)記法の始め方

まずMarkdownをプレビューしながらかけるエディタAtomをインストールします。

このようにMarkdown(マークダウン)を書きます。ソースは下でコピーできます。
Markdownのサンプル

続きを読む

PHPのページをGulpとBrowser Syncでブラウザに自動表示する方法

GulpとBrowser SyncでPHPページの自動更新表示をさせようとするとうまくいかなかったので、設定方法を調べてみました。
続きを読む

Gulp + SASS + assemble を動かすためのgulpfile.jsの設定

Gulpsを使ってassembleから自動的にHTMLやCSSを書き出すためのgulpfile.jsのソースをメモしておきます。

続きを読む

WordPressの子テーマが壊れていますと表示される場合

WordPressの子テーマが壊れていいます、というエラーが出た場合にチェックしたい箇所をメモっておきます。
子テーマのstyle.cssが以下のように設定されているかを確認しましょう。
続きを読む

jQueryでtrのdisplayをblock,noneで表示/非表示させる時に発生する問題の解決法

jQueryでtableタグの中のtrをdisplayでblock,noneを切り替えて、表の行の表示非表示を行おうとすると、trをdisplay:blockにした時にテーブルの表示が崩れてしまいます。その解決法です。

続きを読む

Mac OS X 10.10 YosemiteでApache+PHPの動作環境を設定する方法

Mac OS Xに最初から入っているApacheとPHPを使える状態にする方法です。

続きを読む