l-1

WordPress笔记

主页/WordPress笔记/博客文章/综合文章/如何在WordPress网站上添加作品集

如何在WordPress网站上添加作品集

Bug编译狮

Bug编译狮

要在WordPress网站上添加作品集（Portfolio），你需要遵循以下步骤：

  1. 创建作品集页面：

    • 登录到你的WordPress后台。
    • 在左侧菜单栏选择“Pages”（页面）。
    • 点击“Add New”按钮来创建一个新的页面。

  2. 编辑作品集页面：

    • 在新页面的编辑模式下，点击右上角的“Edit”按钮。
    • 添加标题和描述，例如：“我的作品集”。

  3. 插入作品集内容：

    • 从“Content”标签页切换到“Visual Editor”或“HTML/CSS”标签页。
    • 插入适当的HTML代码来显示作品集的内容。这里以一个简单的示例代码为例：
<div class="portfolio-items">
    <div>
        <h2>项目名称</h2>
        <p>描述</p>
        <a href="链接">了解更多</a>
    </div>
    <!-- 更多项目 -->
</div>
  1. 样式化作品集：
    • 使用CSS样式对作品集进行美化。你可以创建一个新的类或者修改现有类的样式。
    • 示例CSS如下：
.portfolio-items {
    display: flex;
    justify-content: space-around;
    padding: 20px;
}

.portfolio-item {
    background-color: #f9f9f9;
    border-radius: 8px;
    margin-bottom: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

  1. 发布作品集页面：

    • 完成以上所有步骤后，点击底部的“Publish”按钮来发布新的作品集页面。

  2. 设置导航：

    • 如果你想让读者可以轻松地访问这些作品集页面，可以在“Appearance” -> “Menus”中为这些页面添加一个子菜单项。

通过上述步骤，你就可以在WordPress网站上成功添加并展示作品集了。这个例子只是一个基础的布局，实际应用时可以根据具体需求调整样式和功能。

黑板前的Bug语法讲师

黑板前的Bug语法讲师

在WordPress网站上创建和管理作品集是一种强大的方法来展示你的工作或项目。下面我们将一步一步地教你如何在WordPress网站上添加作品集。

步骤 1: 安装 WordPress

首先，你需要安装并配置一个WordPress主题。你可以从WordPress官方站点下载免费的主题，或者使用付费主题。我将使用免费主题“Divi”作为示例。

示例代码：

<div class="content">
    <h2>作品集</h2>
    <div id="myWorks">
        <!-- 作品集内容将在这里显示 -->
    </div>
</div>

步骤 2: 添加作品集页面

接下来，你需要为作品集创建一个新的页面。这可以通过拖放元素到页面中来完成。在Divi主题中，可以点击页面顶部的“新建”按钮，然后选择“页面”。

示例代码：

<?php
get_header(); // 获取页面头部
?>
<h2><?php the_title(); ?></h2>

<div id="main-content" class="page-content">
    <?php
    $args = array(
        'post_type' => 'work',
        'posts_per_page' => -1,
        'orderby' => 'date',
        'order' => 'DESC'
    );

    $query = new WP_Query($args);

    if ($query->have_posts()) : while ($query->have_posts()) : $query->the_post();
        echo '<div class="work-item">';
        the_content();
        echo '</div>';
    endwhile;
    endif;

    wp_reset_query();

    get_footer(); // 获取页面尾部
?>
<?php
endif; // 如果有更多文章...
?>

步骤 3: 设置作品集分类

为了更好地组织和查找作品，你需要为每个作品设置一个分类。在上面的示例中，我们假设每个作品都有一个标题（<title>标签）和一个日期（<time>标签）。你可以通过编辑代码中的$args数组来改变这些值。

示例代码：

<?php
get_header(); // 获取页面头部
?>
<h2><?php the_title(); ?></h2>

<div id="main-content" class="page-content">
    <?php
    $args = array(
        'post_type' => 'work',
        'posts_per_page' => -1,
        'orderby' => 'date',
        'order' => 'DESC'
    );

    $query = new WP_Query($args);

    if ($query->have_posts()) : while ($query->have_posts()) : $query->the_post();
        echo '<div class="work-item">';
        the_content();
        echo '</div>';
    endwhile;
    endif;

    wp_reset_query();

    get_footer(); // 获取页面尾部
?>
<?php
if (is_category() || is_tag() || is_author()) {
    echo '<a href="' . esc_url(get_category_link( get_the_ID() ) ) . '">' . __('查看全部', 'your-theme') . '</a>';
} else {
    echo '<a href="' . esc_url(get_permalink() . '#works') . '">' . __('查看全部', 'your-theme') . '</a>';
}
?>
<?php
endif; // 如果有更多文章...
?>

结语

通过以上步骤，你应该能够成功在WordPress网站上创建和管理作品集。记得定期更新作品集以保持其新鲜度。如果你遇到任何问题，请随时向我提问！

,

最新更新