步驟 1:將必要的庫添加到主題中
首先,您需要使用以下代碼將 Masonry 加載到您的主題中:
if (! function_exists('slug_scripts_masonry') ) : if ( ! is_admin() ) : function slug_scripts_masonry() { wp_enqueue_script('masonry'); wp_enqueue_style('masonry’, get_template_directory_uri().'/css/’); } add_action( 'wp_enqueue_scripts', 'slug_scripts_masonry' ); endif; //! is_admin() endif; //! slug_scripts_masonry exists
這段代碼加載了 Masonry 並使其可供您的主題模板文件使用。
步驟 2:初始化 JavaScript
下一個函數設置了 Masonry,定義了將與其一起使用的容器,並確保所有操作按正確順序進行。以下是頁腳輸出的初始化腳本:
if ( ! function_exists( 'slug_masonry_init' )) : function slug_masonry_init() { ?>
步驟 3:創建 Masonry 循環
創建一個名為 “content-masonry.php” 的新文件並將其添加到您的主題中,這將允許您將 Masonry 循環添加到任何不同的模板中。以下是代碼: