WordPress – ページ 2 – 水色（仮）

2019年11月3日2019年11月3日

WordPress のテーマファイルで、sidebar-left-slugname.php や sidebar-right-slugname.php とかを使いたい / I want to using such sidebar-left-slugname.php or sidebar-right-slugname.php… in a WordPress theme file

WordPress のテーマファイルで、sidebar-left-slugname.php や sidebar-right-slugname.php とかを使いたかったのでやってみたメモ…無駄かな…？

header.php などで、変数 global $Slug を定義してスラッグ名を入れておく

<?php
global $Slug;
if (is_category()) {
	$cat = get_category(get_query_var('cat'), false);
	$Slug = $cat->slug;
} else {
	$Slug = $post->post_name;
}

<?php

global $Slug;

if (is_category()) {

$cat = get_category(get_query_var('cat'), false);

$Slug = $cat->slug;

} else {

$Slug = $post->post_name;

}

functions.php で、sidebar-left-slugname.php や sidebar-right-slugname.php を読み込む＆常時使用するサイドバーを定義

// Sidebar

(function(){
	foreach (glob(__DIR__."/sidebar-{left,right}-*.php", GLOB_BRACE) as $filename) {
		require_once($filename);
	}
})();

register_sidebar(array(
	'name' => __('未使用 置き場'),
	'id' => 'individual-sidebar',
	'description' => '',
	'before_widget' => '<div class="sidebar widget">',
	'after_widget' => '</div>',
	//'before_widget' => '<li>',
	//'after_widget' => '</li>',
	'before_title' => '<h3 class="widget-title">',
	'after_title' => '</h3>'
));

register_sidebar(array(
	'name' => __('Left Sidebar'),
	'id' => 'sidebar-left',
	'description' => '',
	'before_widget' => '<div class="sidebar widget">',
	'after_widget' => '</div>',
	//'before_widget' => '<li>',
	//'after_widget' => '</li>',
	'before_title' => '<h3 class="widget-title">',
	'after_title' => '</h3>'
));

register_sidebar(array(
	'name' => __('Right Sidebar'),
	'id' => 'sidebar-right',
	'description' => '',
	'before_widget' => '<div class="sidebar widget"><div class="widget-inner">',
	'after_widget' => '</div></div>',
	//'before_widget' => '<li>',
	//'after_widget' => '</li>',
	'before_title' => '<h3 class="widget-title">',
	'after_title' => '</h3>'
));

// Sidebar

(function(){

foreach (glob(__DIR__."/sidebar-{left,right}-*.php", GLOB_BRACE) as $filename) {

require_once($filename);

}

})();

register_sidebar(array(

'name' => __('未使用置き場'),

'id' => 'individual-sidebar',

'description' => '',

'before_widget' => '<div class="sidebar widget">',

'after_widget' => '</div>',

//'before_widget' => '<li>',

//'after_widget' => '</li>',

'before_title' => '<h3 class="widget-title">',

'after_title' => '</h3>'

));

register_sidebar(array(

'name' => __('Left Sidebar'),

'id' => 'sidebar-left',

'description' => '',

'before_widget' => '<div class="sidebar widget">',

'after_widget' => '</div>',

//'before_widget' => '<li>',

//'after_widget' => '</li>',

'before_title' => '<h3 class="widget-title">',

'after_title' => '</h3>'

));

register_sidebar(array(

'name' => __('Right Sidebar'),

'id' => 'sidebar-right',

'description' => '',

'before_widget' => '<div class="sidebar widget"><div class="widget-inner">',

'after_widget' => '</div></div>',

//'before_widget' => '<li>',

//'after_widget' => '</li>',

'before_title' => '<h3 class="widget-title">',

'after_title' => '</h3>'

));

テーマ内のサイドバーを表示している部分、dynamic_sidebar が使われているところを下記のような感じにテーマに合わせて変更する

<?php
global $Slug;

echo '<div class="sidebar sidebar-left">';
if (!dynamic_sidebar('sidebar-left-'.$Slug)) {
    dynamic_sidebar('sidebar-left');
}
echo '</div><!-- .sidebar .sidebar-left -->';

echo '<div class="sidebar sidebar-right">';
if (!dynamic_sidebar('sidebar-right-'.$Slug)) {
    dynamic_sidebar('sidebar-right');
}
echo '</div><!-- .sidebar .sidebar-right -->';
?>

<?php

global $Slug;

echo '<div class="sidebar sidebar-left">';

if (!dynamic_sidebar('sidebar-left-'.$Slug)) {

dynamic_sidebar('sidebar-left');

}

echo '</div>';

echo '<div class="sidebar sidebar-right">';

if (!dynamic_sidebar('sidebar-right-'.$Slug)) {

dynamic_sidebar('sidebar-right');

}

echo '</div>';

スラッグ名で使用するサイドバーファイルをこんな感じに作成する sidebar-left-slugname.php

<?php
register_sidebar(array(
	'name' => __('Left Sidebar Slug Name'),
	'id' => 'sidebar-left-slugname',
	'description' => '',
	'before_widget' => '<div class="sidebar widget">',
	'after_widget' => '</div>',
	//'before_widget' => '<li>',
	//'after_widget' => '</li>',
	'before_title' => '<h3 class="widget-title">',
	'after_title' => '</h3>'
));

<?php

register_sidebar(array(

'name' => __('Left Sidebar Slug Name'),

'id' => 'sidebar-left-slugname',

'description' => '',

'before_widget' => '<div class="sidebar widget">',

'after_widget' => '</div>',

//'before_widget' => '<li>',

//'after_widget' => '</li>',

'before_title' => '<h3 class="widget-title">',

'after_title' => '</h3>'

));

2019年8月11日2019年8月11日

ショートコードの出力をキャッシュしてみる / Shortcode output be cached, WordPress

<?php
/*
  Plugin Name: Shortcode output be cached
  Plugin URI:
  Description: Shortcode output be cached. [be_cache _name="target shortcode name" _id="cache id" _keyword="success keyword" atts...]
 */

namespace be_cache_shortcode;

function be_cache($atts, $content = null, $tag) {
    global $shortcode_tags;

    if (!array_key_exists('_name', $atts)) {
        return '<p>be_cache: _name is not defined.</p>';
    }
    if (!array_key_exists('_id', $atts)) {
        return '<p>be_cache: _id is not defined.</p>';
    }

    $tag = $atts['_name'];  // shortcode name
    $gid = $atts['_id'];    // cache id

    $keyword = '';
    if (array_key_exists('_keyword', $atts)) {
        $keyword = $atts['_keyword'];
    }

    if (!array_key_exists($tag, $shortcode_tags)) {
        return '<p>be_cache: _name: "'.$tag.'" is not found.</p>';
    }

    $results = '';
    $error = '';
	if (!check_cache($gid)) {
		// echo '<p>get shortcode data</p>';
        $results = $shortcode_tags[$tag]($atts, $content, $tag);

        if ($keyword) {
            if (stripos($results, $keyword) !== FALSE) {
                // echo '<p>success get shortcode data</p>';
                save_cache($gid, $results);
            } else {
                $error = ' <!-- be_cache: output is error: '.$results.' -->';
                $results = '';
            }
        } else if ($results) {
            // echo '<p>success get shortcode data</p>';
            save_cache($gid, $results);
		}
    }
    if (!$results) {
		// echo '<p>load cache data</p>';
		$results = load_cache($gid, $results);
    }

    return $results.$error;
}

function cache_path($gid) {
	$dir = wp_upload_dir(null, false, false);
	// print_r($dir);
	return $dir['basedir'].'/shortcode-be-cache-'.$gid.'.cache';    // uploads/rss-feed-url...\.cache
}

function check_cache($gid) {
	$path = cache_path($gid);

	if (!file_exists($path)) {
		return false;
	}

	if (date("Ymd", filemtime($path)) < date("Ymd", time())) {
		return false;
	}

	return true;
}

function save_cache($gid, $data) {
	return file_put_contents(cache_path($gid), $data);
}

function load_cache($gid) {
	return file_get_contents(cache_path($gid));
}

if (!shortcode_exists('be_cache')) {
    add_shortcode('be_cache', 'be_cache_shortcode\be_cache');
}

<?php

Plugin Name: Shortcode output be cached

Plugin URI:

Description: Shortcode output be cached. [be_cache _name="target shortcode name" _id="cache id" _keyword="success keyword" atts...]

namespace be_cache_shortcode;

function be_cache($atts, $content = null, $tag) {

global $shortcode_tags;

if (!array_key_exists('_name', $atts)) {

return '<p>be_cache: _name is not defined.</p>';

}

if (!array_key_exists('_id', $atts)) {

return '<p>be_cache: _id is not defined.</p>';

}

$tag = $atts['_name']; // shortcode name

$gid = $atts['_id']; // cache id

$keyword = '';

if (array_key_exists('_keyword', $atts)) {

$keyword = $atts['_keyword'];

}

if (!array_key_exists($tag, $shortcode_tags)) {

return '<p>be_cache: _name: "'.$tag.'" is not found.</p>';

}

$results = '';

$error = '';

if (!check_cache($gid)) {

// echo '<p>get shortcode data</p>';

$results = $shortcode_tags[$tag]($atts, $content, $tag);

if ($keyword) {

if (stripos($results, $keyword) !== FALSE) {

// echo '<p>success get shortcode data</p>';

save_cache($gid, $results);

} else {

$error = ' ';

$results = '';

}

} else if ($results) {

// echo '<p>success get shortcode data</p>';

save_cache($gid, $results);

}

if (!$results) {

// echo '<p>load cache data</p>';

$results = load_cache($gid, $results);

}

return $results.$error;

}

function cache_path($gid) {

$dir = wp_upload_dir(null, false, false);

// print_r($dir);

return $dir['basedir'].'/shortcode-be-cache-'.$gid.'.cache'; // uploads/rss-feed-url...\.cache

}

function check_cache($gid) {

$path = cache_path($gid);

if (!file_exists($path)) {

return false;

}

if (date("Ymd", filemtime($path)) < date("Ymd", time())) {

return false;

}

return true;

}

function save_cache($gid, $data) {

return file_put_contents(cache_path($gid), $data);

}

function load_cache($gid) {

return file_get_contents(cache_path($gid));

}

if (!shortcode_exists('be_cache')) {

add_shortcode('be_cache', 'be_cache_shortcode\be_cache');

}

2019年8月6日2020年2月3日

Page Builder by SiteOrigin のメモ / tips

カラムを左右入れ替える / Swap columns left and right

Row > CSS Style

flex-direction: row-reverse

1	flex-direction: row-reverse

カラムを横並びのままにする / Keep columns side by side

Row > Row Class

parallels

parallels

SASS / CSS

@media screen and (min-width: 539px) and (max-width: 768px)	// 要調整 539px < width <= 768px
	.parallels
		-webkit-flex-direction: row !important
		-ms-flex-direction: row !important
		flex-direction: row !important
		.panel-grid-cell
			width: initial !important
			min-width: 36% !important		// 要調整
		.panel-grid-cell
			padding-right: 30px !important	// 要調整
		.panel-grid-cell:last-child
			padding-right: 0 !important		// 要調整

@media screen and (min-width: 539px) and (max-width: 768px) // 要調整 539px < width <= 768px

.parallels

-webkit-flex-direction: row !important

-ms-flex-direction: row !important

flex-direction: row !important

.panel-grid-cell

width: initial !important

min-width: 36% !important // 要調整

.panel-grid-cell

padding-right: 30px !important // 要調整

.panel-grid-cell:last-child

padding-right: 0 !important // 要調整

2019年6月1日2019年6月1日

プラグイン Recent Posts Widget With Thumbnails にギャラリーからも画像を見つける機能を追加する / Add the ability to find images from the gallery, too

/wp-content/plugins/recent-posts-widget-with-thumbnails/recent-posts-widget-with-thumbnails.php:

    /**
     * Returns the id of the first image on gallery in the content, else 0
     *
     * @access   private
     * @since     6.5.0, 2019-06-01
     *
     * @return    integer    the post id of the first content image
     */
    function get_first_gallery_image_id() {
        $post = get_post();
        $content = $post->post_content;

        if (!preg_match('/\[gallery\s+[^\]]*ids=.*?"([0-9,]+).*?"[^\]]*\]/', $content, $matches)) {
            return 0;
        }
        $ids = explode(',', $matches[1]);
        return $ids[0];
    }

    /**
     * Echoes the thumbnail of first post's image and returns success
     *
     * @access   private
     * @since     2.0
     *
     * @return    bool    success on finding an image
     */
    private function the_first_post_image () {
        // look for first image
        $thumb_id = $this->get_first_content_image_id();
        // if there is first image then show first image
        if ( $thumb_id ) :
            echo wp_get_attachment_image( $thumb_id, $this->customs[ 'thumb_dimensions' ] );
            return true;
        else :
            $thumb_id = $this->get_first_gallery_image_id();
            if ( $thumb_id ) :
                echo wp_get_attachment_image( $thumb_id, $this->customs[ 'thumb_dimensions' ] );
                return true;
            else :
                return false;
            endif;
        endif; // thumb_id
    }

/**

* Returns the id of the first image on gallery in the content, else 0

* @access private

* @since 6.5.0, 2019-06-01

* @return integer the post id of the first content image

function get_first_gallery_image_id() {

$post = get_post();

$content = $post->post_content;

if (!preg_match('/\[gallery\s+[^\]]*ids=.*?"([0-9,]+).*?"[^\]]*\]/', $content, $matches)) {

return 0;

}

$ids = explode(',', $matches[1]);

return $ids[0];

}

/**

* Echoes the thumbnail of first post's image and returns success

* @access private

* @since 2.0

* @return bool success on finding an image

private function the_first_post_image () {

// look for first image

$thumb_id = $this->get_first_content_image_id();

// if there is first image then show first image

if ( $thumb_id ) :

echo wp_get_attachment_image( $thumb_id, $this->customs[ 'thumb_dimensions' ] );

return true;

else :

$thumb_id = $this->get_first_gallery_image_id();

if ( $thumb_id ) :

echo wp_get_attachment_image( $thumb_id, $this->customs[ 'thumb_dimensions' ] );

return true;

else :

return false;

endif;

endif; // thumb_id

}

2019年5月18日2019年5月18日

指定したウィジェットを WordPress の管理画面に配置し、その中で Youtube ビデオの縦横比を保つ / Placing specific widgets to WordPress Admin Screen and keep the Youtube video aspect ratio within

/wp-content/themes/my-theme/functions.php:

register_sidebar(array(
    'name' => sprintf("%s", __('Admin Screen')),
    'id' => 'admin',
    'description' => '',
    'before_widget' => '<div class="admin widget"><div class="widget-inner">',
    'after_widget' => '</div></div>',
    'before_title' => '<h3 class="widget-title">',
    'after_title' => '</h3>'
));

add_action('wp_dashboard_setup', function () {
    wp_add_dashboard_widget('wp_dashboard_widget', 'May I help you?', function () {
        ob_start();		// start buffering output
        dynamic_sidebar('admin');
        $aspectRatio = 9 / 16 * 100; // 56.25%
        ?>
        <style type="text/css">
        .responsive-video {
            position: relative;
            width: 100%;
            padding-top: <?php echo $aspectRatio; ?>%;
        }
        .responsive-video > iframe {
            position: absolute;
            top: 0;
            right: 0;
            width: 100% !important;
            height: 100% !important;
        }

        #wp_dashboard_widget h2 {
            background-color: #f2ff9c;
        }
        #wp_dashboard_widget h3 {
            font-weight: bold;
        }
        </style>
        <?php
        $buffer = ob_get_contents();	// buffered output to variable
        ob_end_clean();					// end buffering

        // Keep the Youtube video aspect ratio.
        if (preg_match('/<iframe[^>]+?(\/www\.youtube\.com\/)[^>]+?>[^<>]*?<\/iframe>/', $buffer, $matches)) {
            $buffer = str_replace($matches[0], '<div class="responsive-video">'.$matches[0].'</div>', $buffer);
        }

        echo $buffer;
    });
});

register_sidebar(array(

'name' => sprintf("%s", __('Admin Screen')),

'id' => 'admin',

'description' => '',

'before_widget' => '<div class="admin widget"><div class="widget-inner">',

'after_widget' => '</div></div>',

'before_title' => '<h3 class="widget-title">',

'after_title' => '</h3>'

));

add_action('wp_dashboard_setup', function () {

wp_add_dashboard_widget('wp_dashboard_widget', 'May I help you?', function () {

ob_start(); // start buffering output

dynamic_sidebar('admin');

$aspectRatio = 9 / 16 * 100; // 56.25%

.responsive-video {

position: relative;

width: 100%;

padding-top: <?php echo $aspectRatio; ?>%;

}

.responsive-video > iframe {

position: absolute;

top: 0;

right: 0;

width: 100% !important;

height: 100% !important;

}

#wp_dashboard_widget h2 {

background-color: #f2ff9c;

}

#wp_dashboard_widget h3 {

font-weight: bold;

}

</style>

<?php

$buffer = ob_get_contents(); // buffered output to variable

ob_end_clean(); // end buffering

// Keep the Youtube video aspect ratio.

if (preg_match('/<iframe[^>]+?(\/www\.youtube\.com\/)[^>]+?>[^<>]*?<\/iframe>/', $buffer, $matches)) {

$buffer = str_replace($matches[0], '<div class="responsive-video">'.$matches[0].'</div>', $buffer);

}

echo $buffer;

});