iphoneから

そういえば、ワードプレスのこのブログ、まだiphoneから書き込みできるか試していない。

やってみるー

なにかアプリとかあるのかな。

SNSを作るので考えてること、

・利用規約とか

・アカウントの制限とか

・プライバシーのなんとかとか

・業者で埋まらないようにとか

・匿名性を高めるか否かとか

うーん。けどシンガポール狭いし、大人しかいないし、匿名性高めておもいっきり大人向けにした方がみんなやりやすそうだよね。

匿名性高めるとどこで楽しめるか?

やっぱり、いつか現実でつながれるのがSNSの楽しみだろうし。。。。

プロフィールは作りたいし。。。。。。匿名性高まるかな?

内面をだらだら書ける、なんでも書けるしシャウトできちゃうとこがあってもいいよね。。。。。。

うーん、方向性が大事。

今度は

ワードプレスも割りとよくできてきたようで、あの後わりと軌道にのってます。

短縮URLもできるし、よかったよかった。

今度はワードプレスで作るSNSに興味深々です。

かな。

ワードプレス管理画面を日本語から英語に言語変更した

このを参考にしました。
ありがとうございます。

WordPress のローカル言語を変更する際に知っておくべきこと
http://eastcoder.com/2012/08/things-you-need-to-know-about-changing-wplang/

簡単に言語変更をしてしまうと色々と不具合が起こるという記述が。

なるほど。

しかし、

WP Multibyte Patch の設定ファイル wpmp-config.php を開き、末尾に用途にあった以下いずれかの一行を追加してください。

// 管理画面では日本語翻訳表示を行い、その他ではデフォルトの英語表示にする場合
add_filter(‘override_load_textdomain’, create_function(”, ‘return !is_admin();’));

// すべてデフォルトの英語表示にする場合
add_filter(‘override_load_textdomain’, ‘__return_true’);

// 管理画面ではデフォルトの英語表示、その他では日本語翻訳表示を行う場合
add_filter(‘override_load_textdomain’, ‘is_admin’);

最後に wpmp-config.php で文字列カウント方式を文字数ベースに固定する機能が有効(true)となっていることを確認してください。
$wpmp_conf[‘patch_force_character_count’] = true;

 

とあるのだか、わからない。

wpmp-config.phpが見つからない。。。。。

 

このプラグインをダウンロードすらしてなかったので、とにかくダウンロード開始。

WP Multibyte Patch

http://eastcoder.com/code/wp-multibyte-patch/

 

 

日本語にしたい場合

http://kinopyo.com/blog/change-language-of-wordpress/

 

 

 

 

 

jQueryで画像をクロスフェードさせる

これをボディの中の貼り付けたい場所へ

◆HTML
<div id=”viewer”>
<img src=”img/photo01.jpg” width=”400″ height=”300″ alt=”” />
<img src=”img/photo02.jpg” width=”400″ height=”300″ alt=”” />
<img src=”img/photo03.jpg” width=”400″ height=”300″ alt=”” />
<img src=”img/photo04.jpg” width=”400″ height=”300″ alt=”” />
</div><!–/#viewer–>

記入順に画像が移り変わっていく。

4枚以上の画像を使用する際は単純に<img>ソースを追加します。

 

CSSを貼り付ける。

#viewer {
margin: 0 auto;
width: 400px;
height: 300px;
text-align: left;
overflow: hidden;
position: relative;
}

#viewer img {
top: 0;
left: 0;
position: absolute;
}

 

 

text-alignleft;で表示させたい場所を変えられる。

画像の大きさはちゃんと記入しておかないとうまく表示されない。

 

 

SCRIPTを貼り付ける

 

<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js”></script&gt;
<script type=”text/javascript”>
$(function(){
var setImg = ‘#viewer’;
var fadeSpeed = 1500;
var switchDelay = 5000;

$(setImg).children(‘img’).css({opacity:’0′});
$(setImg + ‘ img:first’).stop().animate({opacity:’1′,zIndex:’20’},fadeSpeed);

setInterval(function(){
$(setImg + ‘ :first-child’).animate({opacity:’0′},fadeSpeed).next(‘img’).animate({opacity:’1′},fadeSpeed).end().appendTo(setImg);
},switchDelay);
});
</script>

 

fadeSpeedはフェードするスピード
switchDelayは切り替わるタイミング時間
ここで調節できる。

 

 

http://black-flag.net/jquery/20110525-3120.html

ここでお世話になりました。

ありがとう。

 

画像をクロスフェードするJavaScript

<HEAD>から</HEAD>の間にこちらを貼り付ける。

画像の名前を変える。

<SCRIPT type=”text/JavaScript”>
<!–
var img = “pic1.gif,pic2.gif,pic3.gif,pic4.gif,pic5.gif,pic6.gif,pic7.gif,pic8.gif,pic9.gif“;
var imgs = img.split(“,”);
var i=0;
var pic = new Array();
for(cnt=0; cnt<imgs.length; cnt++){
pic[cnt] = new Image();
pic[cnt].src = imgs[cnt];
}
function imgChange(){
i++; i%=imgs.length;
document.getElementById(“img1”).src=pic[i].src;
}
//–>
</SCRIPT>
</HEAD>
<BODY>

置きたい場所にこれを書く。

この青字のimg1の部分は名称。

緑の数値を変更する事で、以下の設定が変更可能です。
・setTimeout:画像の描画速度・・・単位はミリ秒

<TABLE border=1 width=200 height=150><TR><TD><CENTER>
<IMG border=”0″ id=”img1″>
<SCRIPT type=”text/JavaScript”>
<!–
document.getElementById(“img1“).src=pic[0].src;
setInterval(“imgChange()”,
3000);
//–>
</SCRIPT>

リンクの色を変える(ホバー時・CSS使用、不使用)

CSSに記載しなくていい方法
<A HREF=”リンク先URL”>
<SPAN STYLE=”color:red; background:white”
onMouseOver= “style.background=’blue'”
onMouseOut= “style.background=’white'”>サンプル</SPAN>
</A>
  • STYLE=”color:red;background:white”:通常時の文字色と背景色
  • onMouseOver=”style.background=’blue'”:マウスを載せた時の背景色
  • onMouseOut=”style.background=’white'”:マウスが離れた時の背景色

 

 

CSSを使うなら

<テーブル毎に色変えをする>

table.テーブル名 a {color: white;}

a:hover#green {
color:blue;
}

テーブルに

<table  class=”white” >

と入れる。

 

参考ページ

http://www.stylish-style.com/csstec/base/link.html

 

 

 

 

 

蛍光マーカーを引く

<STYLE TYPE=”text/css”>
<!–
.marker { background-color:yellow; }
–>
</STYLE>

を配置して

<span クラス=”マーカー”>マーカー</span>

とか、

<style type="text/css">
   span.yellow	{ background-color: #ffff55; }
</style>

で、

<span>蛍光ペンを引きたい箇所</span>

パンくずリストのデザイン

このページにお世話になりました

http://coliss.com/articles/build-websites/operation/css/css-tutorial-breadcrumbs-with-css-triangle.html

 

 

 

 

高さ設定と準備

.breadcrumb {
list-style: none;
overflow: hidden;
font: 12px Helvetica, Arial, Sans-Serif;
}
.breadcrumb li {
float: left;
}

 

 

 

ここで、三角を作る
.breadcrumb li a {
color: white;
text-decoration: none;
padding: 3px 0 3px 55px;
background: brown;
background: hsla(34,85%,35%,1);
position: relative;
display: block;
float: left;
}
.breadcrumb li a:after {
content: ” “;
display: block;
width: 0;
height: 0;
border-top: 50px solid transparent;
border-bottom: 50px solid transparent;
border-left: 30px solid hsla(34,85%,35%,1);
position: absolute;
top: 50%;
margin-top: -50px;
left: 100%;
z-index: 2;
}

 

 

 

次の文で白いラインを入れる
.breadcrumb li a:before {
content: ” “;
display: block;
width: 0;
height: 0;
border-top: 50px solid transparent;
border-bottom: 50px solid transparent;
border-left: 30px solid white;
position: absolute;
top: 50%;
margin-top: -50px;
margin-left: 1px;
left: 100%;
z-index: 1;
}

 

 

 

 

 

ここで、色の設定。

a:は通常時の色、

a:afterはホバー時の色。

透明度も指定する。

hslaちょっと色指定大変。

 

.breadcrumb li:first-child a {
padding-left: 10px;
}
.breadcrumb li:nth-child(2) a { background: hsla(34,85%,45%,1); }
.breadcrumb li:nth-child(2) a:after { border-left-color: hsla(34,85%,45%,1); }
.breadcrumb li:nth-child(3) a { background: hsla(34,85%,55%,1); }
.breadcrumb li:nth-child(3) a:after { border-left-color: hsla(34,85%,55%,1); }
.breadcrumb li:nth-child(4) a { background: hsla(34,85%,65%,1); }
.breadcrumb li:nth-child(4) a:after { border-left-color: hsla(34,85%,65%,1); }
.breadcrumb li:nth-child(5) a { background: hsla(34,85%,75%,1); }
.breadcrumb li:nth-child(5) a:after { border-left-color: hsla(34,85%,75%,1); }
.breadcrumb li:last-child a {
background: transparent !important;
color: black;
pointer-events: none;
cursor: default;
}

 

.breadcrumb li:last-child a:after { border: 0; }
.breadcrumb li a:hover { background: hsla(34,85%,25%,1); }
.breadcrumb li a:hover:after { border-left-color: hsla(34,85%,25%,1) !important; }

 

 

 

 

 

<table width=”1000″>
<tr>
<td>
<ul class=”breadcrumb”>
<li><a href=”#”>ホーム</a></li>
<li><a href=”#”>商品一覧</a></li>
<li><a href=”#”>商品グループ</a></li>
<li><a href=”#”>リゾート詳細(現在位置)</a></li>
<li><a href=”#”>お問い合わせ</a></li>
</ul>
</td>
</tr>
</table>