投稿

4月, 2019の投稿を表示しています

Dreamweaverでhtmlタグを綺麗にする設定(ソースコードのフォーマット)

イメージ
 Dreamweaverでhtmlを作成していると、プログラマーの人に渡した時に「タブスペースや改行がくずれる」という現象が起きる。 というのも、Dreamweaverでタグをエンター改行すると、インデント分の空白が勝手にタブで入ったりしてしまうのだ。 今まではその都度手作業でスペース入れたりしていたのだが、ちょっとdiv増やしたりするともうスペースの入れ直し!! …というのが一発で解消する方法を知ったので、設定を含めてメモ。 まずは上部メニューの「Dreamweaver」→「環境設定」を開く その中にある「コードフォーマット」で、上記設定をしておく。 ・インデント:☑を使用「2」「スペース」 ・タブサイズ:「2」☑スペースとして挿入 ・TDタグ:□TDタグ内に改行を含めない コード画面左側にある「ソースコードのフォーマット」をクリック その中にメニューとして「コードフォーマット設定」があるので、それを選ぶ。 タグごとに細かな設定ができるので、自分が一番見やすいように修正する。 自分の場合は「a」「div」「head」「button」を修正。 aタグの設定 改行:タグの前後 コンテンツ:フォーマットおよびびインデントあり divの設定 改行:前、中間、後 コンテンツ:フォーマットおよびびインデントあり buttonの設定 改行:前、中間、後 コンテンツ:フォーマットおよびインデントあり headの設定 改行:前、中間、後 コンテンツ:フォーマット及びインデントあり 最後に、「ソースフォーマットの適用」 ソース画面左の「ソースコードのフォーマット」アイコンを押して、「ソースフォーマットの適用」を選択すると、開いているソースの中身が整形されます。 ざっと見直して問題なければこれで完了!

habakiriの子テーマでウィジェットエリアを追加してページフッターに横並びメニューを表示する

habakiriは「アクションフック」と「フィルターフック」が豊富にあってカスタマイズ便利と書いてますが、具体的にどんなことをどこに書けばいいか分からない!デザイナーだから!そしてかなり調べてもなかなか出てこない! 親のfunction.phpに書いてある151行目「Register widget areas」を子のfunciton.phpにコピペして、内容だけ変えてみても、やはり競合して表示できない。 親のregister_sidebarを子テーマのfunction.phpでremove(削除)した後に、親テーマの内容+追加分を記載するやり方も載っていたが、それだとhabakiriテーマがアップデートした時に変更があったらなんか怖い…。 そこで、本来のwordpressのアクションフックを使って普通にウィジェットエリアを追加することで解決しました。 ■子テーマのfunciton.phpに以下を追記する(子テーマを定義している箇所の後ろ) //親テーマのウィジェット読み込み後、子テーマのウィジェットを追加する add_action( 'init', 'add_sidebar' ); function add_sidebar(){ register_sidebar( array( 'name' => __( 'Footer-menu', 'habakiri' ), 'id' => 'footer-menu-area', 'before_widget' => '<div id="%1$s" class="widget footer-menu-widget %2$s">', 'after_widget' => '</div>', 'before_title' => '<h2 class="footer-menu-widget__title">', ) );...

habakiri 固定ページ・個別(投稿)ページ・その他ページのヘッダー画像にアイキャッチ画像を使用

■Wordpressテーマ「habakiri」の子テーマで、固定ページ、個別ページ(投稿ページ)、その他ページのヘッダーに表示される画像を変更する。 ・カスタマイズ前の状態では、各ページのヘッダー画像は固定で1枚に決まってしまっているので、固定ページの「アイキャッチ画像」に選択した画像をヘッダー画像として表示します。 ・もし親ページがある場合は(子ページの場合は)親ページのアイキャッチ画像を表示する。 ・ それ以外のページ(404ページや検索ページ)の場合は、指定のページのアイキャッチ画像を表示する。 ■変更するファイル wp-content/themes/habakiri-child/inc/class.entry-meta.php (habakiri-childのフォルダ名は作成した際の子テーマのフォルダ) ■変更する箇所 行番号:26 あたりから、Display page header の設定場所が始まる。 行番号:34 でphpが終了した後辺りに、以下を追加します。 <?php global $post; $parent_id = $post->post_parent; if(get_the_post_thumbnail_url()): ?> ↑の説明 $parent_idに、親IDを代入 get_the_post_thumbnail_url()で、アイキャッチ画像が設定されているかどうか確認 <style> /*get_the_post_thumbnail_url*/ .page-header{ background:url(<?php echo get_the_post_thumbnail_url(get_the_ID(),'full'); ?>); background-size:cover; } </style> ↑の説明 アイキャッチ画像が設定されている場合は、.page-headerのclassにbackgroundで自分のページget_the_ID()のアイキャッチ画像を指定してます <?php elseif( is_page() && $parent_id...

このブログの人気の投稿

Dreamweaver(ドリームウィーバー)でコピーができない。ペーストができない。

wordpressのtwentyseventeenのヘッダー画像サイズを統一する

Dreamweaverでhtmlタグを綺麗にする設定(ソースコードのフォーマット)