自定义页眉 – WordPress大学 |
您所在的位置:网站首页 › id加页眉 › 自定义页眉 – WordPress大学 |
文章目录 Toggle 自定义页眉自定义页眉(Header)允许站点所有者将自己的“页眉”图像上传到其站点,该图像可以放置在某些页面的顶部。用户可以通过管理面板的“外观”>“页眉”部分中的可视编辑器来自定义和裁剪这些内容。您也可以在页眉下方或上方放置文本。为了支持流畅的布局和响应式设计,这些页眉也可以是灵活的。可以在主题中使用get_custom_header()调用页眉,但是必须首先使用 add_theme_support() 将页眉添加到您的functions.php文件中。自定义页眉是可选的。 要设置带有文本的基本、灵活、自定义页眉,您应包含以下代码: function themename_custom_header_setup() { $args = array( 'default-image' => get_template_directory_uri() . 'img/default-image.jpg', 'default-text-color' => '000', 'width' => 1000, 'height' => 250, 'flex-width' => true, 'flex-height' => true, ) add_theme_support( 'custom-header', $args ); } add_action( 'after_setup_theme', 'themename_custom_header_setup' );使用after_setup_theme挂钩,以便在加载主题之后注册自定义页眉。 什么是自定义页眉?在主题中启用自定义页眉后,用户可以使用WordPress主题自定义程序更改其页眉图像。这为用户提供了对其网站外观的更多控制和灵活性。 为主题添加自定义页眉支持要在主题中启用自定义页眉,请在您的主题的 functions.php 文件添加以下内容: function themename_custom_header_setup() { $defaults = array( // 要显示的默认页眉图片 'default-image' => get_template_directory_uri() . '/images/headers/default.jpg', // 是否要显示页眉文本 'header-text' => false, // 页眉文本颜色 'default-text-color' => '000', // 页眉图片宽度(像素) 'width' => 1000, // 页眉图片高度(像素) 'height' => 198, // 页眉图片随机旋转默认 'random-default' => false, // 在后台启用图片上传 'uploads' => false, // 主题页眉部分的回调函数 'wp-head-callback' => 'wphead_cb', // 在预览中页眉部分的回调函数 'admin-head-callback' => 'adminhead_cb', // 在管理屏幕中生成预览标记的函数 'admin-preview-callback' => 'adminpreview_cb', ); } add_action( 'after_setup_theme', 'themename_custom_header_setup' ); 灵活页眉标题如果数组中不包含flex-height或flex-width,则height和width将为固定大小。如果包括flex-height和flex-width,则将高度和宽度用作建议的尺寸。 页眉文本默认情况下,用户可以选择是否在图像上显示页眉文本。没有选项可以将页眉文本强制显示在用户网站上,但是如果要完全删除页眉文本,可以在参数中将'header-text'设置为'false'。这将删除页眉文本和用于切换页眉的选项。 示例 设置自定义页眉图片用户首次安装主题时,您可以包括一个默认页眉,该页眉将在他们选择自己的页眉之前被选择。这使用户可以更快地设置您的主题并使用您的默认图像,直到他们准备上传自己的图片为止。 设置默认的页眉图片宽度980px和高度60px: $header_info = array( 'width' => 980, 'height' => 60, 'default-image' => get_template_directory_uri() . '/images/sunset.jpg', ); add_theme_support( 'custom-header', $header_info ); $header_images = array( 'sunset' => array( 'url' => get_template_directory_uri() . '/images/sunset.jpg', 'thumbnail_url' => get_template_directory_uri() . '/images/sunset_thumbnail.jpg', 'description' => 'Sunset', ), 'flower' => array( 'url' => get_template_directory_uri() . '/images/flower.jpg', 'thumbnail_url' => get_template_directory_uri() . '/images/flower_thumbnail.jpg', 'description' => 'Flower', ), ); register_default_headers( $header_images );不要忘记调用register_default_headers()注册默认图像。在此示例中,sunset.jpg是默认图像,并且flower.jpg是Customizer中的替代选择。 在管理屏幕中,单击外观>页眉以在Customizer中显示“页眉图像”菜单。请注意,在add_theme_support()中指定的宽度和高度将显示为建议的大小,并flower.jpg显示为可选选项。 使用灵活页眉默认情况下,用户将必须裁剪其上传的所有图像以适合您指定的宽度和高度。但是,您可以通过将'flex-width'和'flex-height'指定为true,让用户上传任何高度和宽度的图像。用户上传新图片时,这将允许用户跳过裁剪步骤。 设置灵活的页眉: $args = array( 'flex-width' => true, 'width' => 980, 'flex-height' => true, 'height' => 200, 'default-image' => get_template_directory_uri() . '/images/header.jpg', ); add_theme_support( 'custom-header', $args );将header.php文件更新为: |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |