投稿者「あたい」のアーカイブ

特定のカテゴリーだけ表示させるプラグイン

Recent posts of specific category

これ。

便利すぎ。
ウィジェットで最新の投稿一覧を出す時に特定のカテゴリだけを表示することが出来るよ!

WPウィジェット上の最新の投稿一覧で特定のカテゴリーを除外

これfunction.phpに入れとけ。

<?php

class WP_Widget_Recent_Posts_Exclude extends WP_Widget {

function __construct() {
$widget_ops = array('classname' => 'widget_recent_entries', 'description' => __( "The most recent posts on your site") );
parent::__construct('recent-posts', __('Recent Posts with Exclude'), $widget_ops);
$this->alt_option_name = 'widget_recent_entries';

add_action( 'save_post', array(&$this, 'flush_widget_cache') );
add_action( 'deleted_post', array(&$this, 'flush_widget_cache') );
add_action( 'switch_theme', array(&$this, 'flush_widget_cache') );
}

function widget($args, $instance) {
$cache = wp_cache_get('widget_recent_posts', 'widget');

if ( !is_array($cache) )
$cache = array();

if ( ! isset( $args['widget_id'] ) )
$args['widget_id'] = $this->id;

if ( isset( $cache[ $args['widget_id'] ] ) ) {
echo $cache[ $args['widget_id'] ];
return;
}

ob_start();
extract($args);

$title = apply_filters('widget_title', empty($instance['title']) ? __('Recent Posts') : $instance['title'], $instance, $this->id_base);
if ( empty( $instance['number'] ) || ! $number = absint( $instance['number'] ) )
$number = 10;
$exclude = empty( $instance['exclude'] ) ? '' : $instance['exclude'];

$r = new WP_Query(array('posts_per_page' => $number, 'no_found_rows' => true, 'post_status' => 'publish', 'ignore_sticky_posts' => true, 'category__not_in' => explode(',', $exclude) ));
if ($r->have_posts()) :
?>
<?php //echo print_r(explode(',', $exclude)); ?>
<?php echo $before_widget; ?>
<?php if ( $title ) echo $before_title . $title . $after_title; ?>
<ul>
<?php while ($r->have_posts()) : $r->the_post(); ?>
<li><a href="<?php the_permalink() ?>" title="<?php echo esc_attr(get_the_title() ? get_the_title() : get_the_ID()); ?>"><?php if ( get_the_title() ) the_title(); else the_ID(); ?></a></li>
<?php endwhile; ?>
</ul>
<?php echo $after_widget; ?>
<?php
// Reset the global $the_post as this query will have stomped on it
wp_reset_postdata();

endif;

$cache[$args['widget_id']] = ob_get_flush();
wp_cache_set('widget_recent_posts', $cache, 'widget');
}

function update( $new_instance, $old_instance ) {
$instance = $old_instance;
$instance['title'] = strip_tags($new_instance['title']);
$instance['number'] = (int) $new_instance['number'];
$instance['exclude'] = strip_tags( $new_instance['exclude'] );
$this->flush_widget_cache();

$alloptions = wp_cache_get( 'alloptions', 'options' );
if ( isset($alloptions['widget_recent_entries']) )
delete_option('widget_recent_entries');

return $instance;
}

function flush_widget_cache() {
wp_cache_delete('widget_recent_posts', 'widget');
}

function form( $instance ) {
$title = isset($instance['title']) ? esc_attr($instance['title']) : '';
$number = isset($instance['number']) ? absint($instance['number']) : 5;
$exclude = esc_attr( $instance['exclude'] );
?>
<p><label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title:'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo $title; ?>" /></p>

<p><label for="<?php echo $this->get_field_id('number'); ?>"><?php _e('Number of posts to show:'); ?></label>
<input id="<?php echo $this->get_field_id('number'); ?>" name="<?php echo $this->get_field_name('number'); ?>" type="text" value="<?php echo $number; ?>" size="3" /></p>

<p>
<label for="<?php echo $this->get_field_id('exclude'); ?>"><?php _e( 'Exclude Category(s):' ); ?></label> <input type="text" value="<?php echo $exclude; ?>" name="<?php echo $this->get_field_name('exclude'); ?>" id="<?php echo $this->get_field_id('exclude'); ?>" class="widefat" />
<br />
<small><?php _e( 'Category IDs, separated by commas.' ); ?></small>
</p>
<?php
}
}

function WP_Widget_Recent_Posts_Exclude_init() {
unregister_widget('WP_Widget_Recent_Posts');
register_widget('WP_Widget_Recent_Posts_Exclude');
}

add_action('widgets_init', 'WP_Widget_Recent_Posts_Exclude_init');

?>

前から気になってたんだけど、WPテーマの中でfunction.phpとfunctions.phpがあるのは何故?????????

サブページなどページ毎にヘッダーなどを変える

使い所としては、サブページにはスライドショーを出したくない!グローバルメニューだけで良い!という時用です。
トップとサブページに同じテンプレートを適用すると、同じheader.phpが読まれてしまうのです。
なので、スライドショーを削除したheader.phpを作成する感じです。詳細は以下。

1. 異なるヘッダーを使用するページ用のpage-sub.phpを作成します。(subの部分は任意です)

2. page-new.php内の冒頭に下記の記述を行います。

<?php

/*
Template Name: サブページ用(とか)
*/

?>

3. 異なるヘッダーを使用するページ用のheader-sub.phpを作成します。

4. page-sub.php内に下記の記述をし、header-sub.phpを呼び出します。

<?php get_header(sub); ?>

5. page-sub.phpとheader-sub.phpをサーバ上のオリジナルテーマフォルダ内にアップロードします。

あとは固定ページのテンプレートで選べるようになるよ。

特定カテゴリーの記事一覧を出力

これphpファイルに書いておけばいいと思うよ。
固定ページに入れたいんだがってときは、外部phpファイルを固定ページに読み込むといいよ。
この記事読んでね。

<?php
$posts = get_posts(array(
'posts_per_page' => 2, // 表示件数
'category' => '4' // カテゴリIDもしくはスラッグ名
));
?>
<?php if($posts): foreach($posts as $post): setup_postdata($post); ?>

<!--表示する内容が入ります。-->
<h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>
<p><?php the_time('Y/m/d') ?></p>
<p><?php the_excerpt(); ?></p>
<p><a href="<?php the_permalink() ?>">続きを見る</a></p>
<!--表示する内容ここまで-->

<?php endforeach; endif; ?>

白半透明背景の作り方

CSSのプロパティだよ。
RGBいじれば色が変わるよ。
1に近づくと色が濃くなるよ!

background-color:rgba(255,255,255,0.5);

╰(*´︶`*)╯

ヘッダーのナビを固定してあとからぬるっと出したいとか

スクロールしたら、ヘッダーのナビがあとからニュっと出てくるサイトあるよね。それ。

HTML

<header>

  ...

</header>

<nav>
...
</nav>

<main>
...
</main>

<footer>
...
</footer>

CSS

.clone-nav {
position: fixed;
top: 0;
left: 0;
z-index: 2;
width: 100%;
transition: .3s;
transform: translateY(-100%);
}
.is-show {
transform: translateY(0);
}

JS

$(function() {

  var $win = $(window),

      $cloneNav = $('nav').clone().addClass('clone-nav').appendTo('body'),

      showClass = 'is-show';

$win.on('load scroll', function() {
var value = $(this).scrollTop();
if ( value > 700 ) {
$cloneNav.addClass(showClass);
} else {
$cloneNav.removeClass(showClass);
}
});
});

 

参考サイト

jQuery:スクロールしたらヘッダーやナビゲーションを固定・変化させる動きを実装するサンプルコード 5


		

WordPressでJqueryを使う時

こうする。

jQuery(function($){ });

で囲む。

具体的にはこう!

<script type="text/javascript">
jQuery(function($){
//ここに普通のjQueryの書き方で。下の行は例
$("#jquery_test_wp").html("jQuery WordPress構文テスト")
});
</script>

私が作ったのはこう!

jQuery(function($){
var $win = $(window),
$cloneNav = $('nav').clone().addClass('clone-nav').appendTo('body'),
showClass = 'is-show';

$win.on('load scroll', function() {
var value = $(this).scrollTop();
if ( value > 100 ) {
$cloneNav.addClass(showClass);
} else {
$cloneNav.removeClass(showClass);
}
});
});

重要。

投稿・固定ページ内にPHPファイルをインクルード(挿入/実行)させる

function.phpにこれを入れる

<?php

//ここから
function Include_my_php($params = array()) {
extract(shortcode_atts(array(
'file' => 'default'
), $params));
ob_start();
include(get_theme_root() . '/' . get_template() . "/$file.php");
return ob_get_clean();
}

add_shortcode('myphp', 'Include_my_php');
//ここまで

?>

これを固定ページに

[myphp file='papo']

ファイルをまとめたいとき

include(get_theme_root() . '/' . get_template() . "/tama/$file.php");

子テーマ化してるとき

function Include_my_php($params = array()) {
extract(shortcode_atts(array(
'file' => 'default'
), $params));
ob_start();
get_template_part("/myphpfiles/$file");
return ob_get_clean();
}

add_shortcode('myphp', 'Include_my_php');

検索用文字列:ショートコード

左揃えのテキストを中央に寄せる

お前何言ってんだ~~~!
って感じですが、そのまんまだ!
やりたい時結構ある。

これCSS

.wrapper {
max-width: 300px;
margin: 0 auto;
text-align: center;
background: #cccccc;
}
.txt {
display: inline-block;
text-align: left;
}

これHTML

<div class="wrapper">
<p class="txt">
ダミーテキスト<br>
ダミー
</p>
</div>

イイネ

自動でデバイス別提案用モックが作れる

すごすぎでは?
もっと早く知ってたかった

https://ferret-plus.com/2019