Test!

写真とWebデザインと時たまダイエット

西暦和暦変換表サイト用を作ってみた

Javascriptの練習も兼ねて西暦和暦変換表を作ってみた。
一応自分の生まれた年である昭和から平成までだけど。
app.ttmphotograph.net/calendar_conve…app.ttmphotograph.net

#Javascript

最後のカンマを消去する

配列だったのでつい、配列の最後からカンマを消去とかおもってたんですけど
最後に出力する文字列から、最後のカンマを消去するだけでよかったんですね。ということを
1日悩んで気がついた(バカ
別に配列の最後探してカンマを付けない処理でもいいのだけれど
途中飛ばして値を入れる処理が入ってたりするとずれるので、うまくいかなかった。

参考

$user_ids = "id_01,id_02,id_03,id_04,";

$user_ids = substr($user_ids, 0, -1); //最後の「,」を削除

開発メモ:文字列の最後の1字を削除|理総研Web@中学受験専門理科総合研究所

単純にsubstrを使えばいいんですよね。

CSS設計の参考になるサイト

CSSどうやって作ってる?

たまに、様々な人の手が加わって、長い年月がたってるサイトのメンテナンスとかするんですが
CSSとかがかなり複雑怪奇になってたり。
で、どうやって、設計するのがいいのだろうかと思ったり、自分の今までのやり方を見直す
機会かなとおもっていろいろ参考になるサイトをさがしてみました。


CSS 設計の長い夢 - ペパボのフロントエンドスタンダード

破綻しにくいCSS設計の法則 15 - Qiita

より良いCSSを書くための様々なCSS設計まとめ | UX MILK

Twitter認証画面を2回目以降表示しない方法

twitterOauth認証をログイン代わりに使いたくて、こちらのサイトを参考にさせてもらって作成を行った。
noumenon-th.net

しかし、アプリとして一度認証したのに毎回認証画面が表示されるのがめんどくさかった。

そこで調べてみると、ログインに使われるURLは2種類あって

一度認証すると次からは認証画面が出ないタイプ→ GET oauth/authenticate
と毎回認証画面が出るタイプ→ GET oauth/authorize

が有るということがわかった。
なので、ログインでそこら辺を使っている部分を変えると1回めのときに認証すると、2回め以降は認証画面に飛ばされずリダイレクトされるようになった。

// Twitterの認証画面へリダイレクト
$url = $connection->url("oauth/authenticate", array("oauth_token" => $request_token['oauth_token']));

ChoromeとFirefoxで見え方の違うフォームの統一方法

selectがChoromeとFirefoxで見え方が違ったので統一する方法を調べてみた

Choromeだとかってにぼーだーらでぃうすが設定されてしまい、角丸が勝手ついてしまう。
それが嫌だったので、CSSででなんとかできないか考えてみた。
まずはselect自体のデフォルトのCSSをリセット。
appearance: none;でブラウザのデフォルトなどが消える。
で、label:beforeでselectの消えてしまった矢印を設定してあげる。その時に、select自体に、矢印の部分のスペースを右に開けてあげ、なおかつZ-indexを設定することで、矢印部分を押してもselectが選べるようにする。

select {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

select {
    padding-right: 20px;
    position: relative;
    z-index: 2;
    background: transparent;
}

label {
    position: relative;
    display: block;
    background: #fff;
}

label:before {
    content: "\f0dc";
    font-family: FontAwesome;
    cursor: pointer;
    position: absolute;
    right: 15px;
    top: 50%;
    width: 0;
    height: 0;
    margin-top: -10px;
    background: #fff;
    display: block;
}

   <label>
        <select>
            <option>選択肢1</option>
            <option>選択肢2</option>
            <option>選択肢3</option>
        </select>
    </label>

カスタム画像をフロントエンドから投稿する方法メモ

カスタム画像をフロントエンドから投稿する方法メモ

//画像の添付
			if ($_FILES['image']) {
				foreach ($_FILES as $file => $array) {
					if ($_FILES[$file]['error'] !== UPLOAD_ERR_OK) {
						return "upload error : " . $_FILES[$file]['error'];
					}
					require_once(ABSPATH . "wp-admin" . '/includes/image.php');
					require_once(ABSPATH . "wp-admin" . '/includes/file.php');
					require_once(ABSPATH . "wp-admin" . '/includes/media.php');
					$attach_id = media_handle_upload($file,$update_id );
				}
			}
			if ($attach_id > 0){
				update_post_meta($update_id,'image',$attach_id);
			}

タクソノミーを変えたいときは
wp_set_object_terms
カスタムフィールドをかえたいときは
update_post_meta

WordPressの管理画面以外で簡単に『投稿・編集・削除』を行う | com4tis

wp_set_object_terms:WordPress私的マニュアル

100件ごとにフォルダを分ける処理

もう少し綺麗に書けそうな気がするけど、割って切り上げた数の+1のフォルダに。
で、割り切れるときは1〜100にしたかったので−1して1コマエのフォルダに。
 >|| $ii =1+floor($i/100);
if($i%100 ==0){
$ii = $ii-1;
}
|