Wordpress

WordPressテーマファイルを作成する際に役に立つ設定集

HTML/CSSコーディングデータをWordpressに落とし込む作業に必ずと言っていいほど使用するコードをここにまとめておきます。本当に頻繁に使用するところはスニペットなどに登録することをおすすめします。

随時追記中…

テンプレート

underscores

こちらのサイトでテーマファイルのスターターテンプレートを作成しダウンロード

functionsの設定

inc/theme-functions.phpに下記の関数を登録

ACF/CPTを使う場合

/inc/acf.php/inc/cpt.phpを追加し、theme-functions.phpに下記を追加

require get_template_directory() . '/inc/acf.php';

require get_template_directory() . '/inc/cpt.php';

スクリプト・スタイルの登録

function scripts() {
  $url = get_template_directory_uri();
  if(!is_admin()) {
    wp_enqueue_style( 'theme-style', "$url/css/bootstrap.css" );

    wp_enqueue_script('theme-script', "$url/js/main.js", ['jquery'], NULL, TRUE);
  }
}
add_action( 'wp_enqueue_scripts', 'scripts' );

HTML内にCSSを埋め込み

header.php

<?php
  $css = '<style>'.file_get_contents(dirname( __FILE__ ) . '/inline.css').'</style>';
  echo $css;
?>

ナビゲーションの設定

/functions.php

register_nav_menus( array(
    'menu' => 'Main Menu',
));
wp_nav_menu(array(
    'theme_location' => 'menu',
    'container' => '',
    'container_class' => '',
    'container_id' => '',
    'depth' => 1,
))

ウィジェット

function widgets_init() {
  register_sidebar( array(
    'name'          => 'widget_name',
    'id'            => 'sidebar-1',
    'description'   => 'area 1',
  ) );
}
add_action( 'widgets_init', 'widgets_init' );
dynamic_sidebar( 'widget_name' );

日付表示

get_the_time(get_option( 'date_format' ))

404

docker-compose

とりあえず自分の使ってるdocker-composeはこんな感じで、必要になったらコメント取る感じです
注意点としてはメールに関してはwordpress:latestのイメージでは出来ないので、したい時はDockerfileをいじります。

 

コーディング代行

高品質なソースコードをお約束

詳しくはこちら
背景イメージ
背景はFreepikによるデザイン

information

お問い合わせ