こちらのドキュメントに従ってください - https://www.metaslider.com/docs/how-to-add-metaslider/
0Like
wordpressのテーマhestiaの無料版を使ったヘッダースライドの実装方法
解決したいこと
wordpressでhestiaというテーマの無料版を使っているのですが、トップ画像をスライドショーにし、フェードで画像を切り変える仕様にしたいのですが、トップ画像をスライドに変更する際の実装方法が分かりません。
MetaSliderというプラグインでスライドショーを制作し、front-page.phpやfunction.phpを編集しスライダーを追加しようと試したのですが、変化が起きないか、frontページ全体のデザインが崩れるか、デフォルトのheaderが消えるのみでスライダーが追加されない状態なってしまいます。
発生している問題・エラー
一つ目のコードをfront-page.phpに、2つ目のコードをfunction.phpに追加しました。
front-page.phpの方は、デフォルトのトップ画像部分が消え、metaslider id="467"が代わりに表示される状態です。
function.phpの方は何も変化起きずでした。
両方ともコード自体のエラーはつかず、反映されています。
該当するソースコード
<?php
/**
* The front page template file.
*
* If the user has selected a static page for their homepage, this is what will
* appear.
* Learn more: http://codex.wordpress.org/Template_Hierarchy
*
* @package Hestia
* @since Hestia 1.0
*/
get_header();
/**
* Hestia Header hook.
*
* @hooked hestia_slider_section
*/
echo do_shortcode('[ metaslider id="467 ]'); ?>
<div class="<?php echo esc_attr( hestia_layout() ); ?>">
<?php
/**
* Hestia Sections hook.
*
* @hooked hestia_features_section - 1
* @hooked hestia_about_section - 2
* @hooked hestia_shop_section - 3
* @hooked hestia_portfolio_section - 4
* @hooked hestia_team_section - 5
* @hooked hestia_pricing_section - 6
* @hooked hestia_testimonials_section - 7
* @hooked hestia_subscribe_section - 8
* @hooked hestia_blog_section - 9
* @hooked hestia_contact_section - 10
*/
do_action( 'hestia_sections', false );
?>
</div>
<?php
get_footer();
?>
add_action( 'hestia_child_header_after', 'my_custom_hestia_child_header_after', 6 );
function my_custom_hestia_child_header_after()
{
// ~~~
}
add_action( 'hestia_child_header_after', 'my_favorite_slideshow', 6 );
function my_favorite_slideshow()
{
if( is_front_page() && !is_paged() ) {
echo do_shortcode ( '[metaslider id="467"]' );
}
}
0