CSSが得意な渋谷のウェブデザイナーのウェブ開発メモ

[PR] Another American Dictionary Spanglish with us!

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Atomインストール後にする設定

Core

新規タブで開く

「Allow Pending Pange Items」のチェックを外す

プロジェクトサイドバーに表示させないファイル指定

「Ignored Name」にphotothumb.db, *.psd など

Editor

インデントの感じをnotepad++に近いように設定

Show Indent Guide にチェック

Show Invisibles チェックを外す

折り返し設定

Preferred Line Length 180 (解像度によって調整)

Packages

インデントの長さ設定

「Tab Length」 を4に

install

プロジェクト管理

project-manager

ダブルクリックした単語をハイライトさせる(notepad++のように)

highlight-selected

スポンサーサイト

WordPress: 単純にカテゴリIDを指定してカテゴリ名を取得する

<?php 
$cateterm = get_term_by('id', ここにカテゴリID, 'category');
echo $cateterm->name;
?>


参照 [関数リファレンス/get term by]

画像をphotoshopでドット絵にする

イメージ > モード > インデックスカラー

  • パレット:RGBカラーを均等に割りつける
  • 表示色:3
  • 透明:オフ
  • マット:なし
  • ディザ:誤差拡散法
  • 量:要調整
  • 同一色の保持:オフ

参照 [Convert to Indexed Color with Dithering]

投稿ページ single.php でカテゴリIDを収得

<?php 
$id = get_the_id(); 
$terms = get_the_terms( $id, 'category' ); // print_r( $terms ); 
foreach($terms as $term) { 
echo $term->cat_ID;
 ?>
参照 [How to get category id in single.php wordpress?]

jQuery でタブ切り替えコンテンツ

スマホサイトでもよく使うjQueryです。CSSはおこのみでどうぞ。

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
Loremのイプサムの嘆きがAMET座る、consectetur adipiscing ELIT、eiusmod労働と肥満ように、temporと活力んsedの。長年にわたり、私はそれから、学区nostrudのaliquipの利点を行使してはならない人、来るが、動作させるためになります。 Duisは1 irureがcillumのdolore EUは何の結果を生成しない逃げるように欲望の痛みの喜びで批判されています。 Excepteur cupidatatブラックは、うまくいけば、あなたは罪のQUIのofficiaで、つまり、私の労苦、suntを女々しいとその精神を放棄されていません

html

<ul class="tabs">
	<li class="active"><a href="#tab1">ラテン語</a></li>
	<li class=""><a href="#tab2">日本語</a></li>
</ul>
<div id="tab1" class="content">
コンテンツA
</div>
<div id="tab2" class="content">
コンテンツB
</div>

javascript

<script type="text/javascript"> 
$(document).ready(function() {
	$(".content").hide(); 
	$("ul.tabs li:first").addClass("active").show(); 
	$(".content:first").show(); 
	$("ul.tabs li").click(function() {
		$("ul.tabs li").removeClass("active"); 
		$(this).addClass("active");
		$(".content").hide();
		var activeTab = $(this).find("a").attr("href"); 
		$(activeTab).fadeIn();
		return false;
	});
});
</script>

効かないCSSあるあるまとめ

table にCSSで指定したwidthが効かない

table か td に以下のコード

table-layout:fixed;
参照 [テーブルのセルの幅を指定したにもかかわらず、意図したセル幅にならない]

z-indexが効かない

positionを指定せよ

tag.php で 現在のタグIDを取得

<?php $current_tag_id = $wp_query->query_vars['tag_id']; ?>

参照 [I need to GET the ID of a Tag, so I can use it]

category.php で 現在のカテゴリIDを取得

<?php $cur_cat_id = get_cat_id( single_cat_title("",false) ); ?>
参照[Get category id for category.php page]
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。