2016年12月 Archive

LINEで送る のURLはこんなかんじ。

<a href="http://line.me/R/msg/text/?【テキストやURL】">
このページを友達にLINEで教える。
</a>


UTF-8への変換ツールは
http://www.tagindex.com/tool/url.html

inputやselect textarea一括で格好よくcss設定したい

/* 入力フィールド共通 */
select,
textarea,
input.tel,
input[type="url"],
input[type="file"],
input[type="text"],
input[type="email"] {
font-size:120%;
font-family:"メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif;
width: 96%;
margin-bottom:1%;
padding: 1.5%;
border: 1px solid #000000;
box-sizing: border-box;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
/* 電場番号の上下矢印非表示for Chrome */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

スマホサイトをデザインするとき、どのくらいのサイズ(キャンパス)で作成すればいい?ファーストビューは?

iPhone4/4S: 640×960(ファーストビュー)
iPhone5/5S/5C: 640×1136( 〃 )
iPhone6 : 750x1334( 〃 )

なので、
幅640ピクセルでデザイン作成していただけるとちょうど良い感じになります。

カスタム投稿でアイキャッチを使う

何度か失敗したので、うまくいったときの記事を引用してメモ。


カスタム投稿でアイキャッチを使う方法

上の記述をしていても、カスタム投稿ではアイキャッチが利用できませんでした。

どうやら、カスタム投稿の設定で、引数?「supports」に『アイキャッチ使えるように』って値を与えてあげないといけないらしい。

'supports' => array( 'title', 'editor', 'thumbnail')
これだと、タイトルと編集とアイキャッチ画像。という意味ですね。

例えば、『blog』というカスタム投稿タイプでアイキャッチを使えるように設定する場合、
------------------------------------------------------
add_action( 'init', 'blog_init' );
 
function blog_init() {
    $args = array(
                    'supports' => array( 'title', 'editor', 'thumbnail')
                    );
    register_post_type( 'blog', $args );
}
------------------------------------------------------
これでカスタム投稿でアイキャッチが使えるようになりました。

あと注意しないといけないのは、register_post_type()は'init'アクションから呼び出さないといけないということでしょうか。


私は「information」という名前のカスタム投稿を追加してて、出来上がりは

------------------------------------------------------
add_action( 'init', 'information_init' );

function information_init() {
$args = array(
'supports' => array( 'title', 'editor', 'thumbnail')
);
register_post_type( 'information', $args );
}
------------------------------------------------------
supportsを変更したくなりがちだけど、違うみたいね。




▼ついでに
表示するためのタグも
<?php if(get_the_post_thumbnail( $id )): //アイキャッチあれば ?>
  <?php echo get_the_post_thumbnail( $id,'サイズ名' ); ?>
  <?php else: //無い場合の処理 ?>
   
  <?php endif; ?>

レスポンシブに最適なフォントサイズ

文字サイズの単位、迷いますよね~~

font-size:2.7vw;

↑ vwを使ってから、さらにその子孫に%やemを使えば、
相対的に、デバイスサイズに合わせて伸び縮みしてくれます。
1