dawidurbanski/sage-directives

一套用于Roots Sage的Blade指令。

v1.0.6 2019-02-27 12:59 UTC

This package is auto-updated.

Last update: 2024-09-28 02:27:50 UTC


README

Latest Stable Version Total Downloads

Sage Directives 是一个简单的Composer包,为Sage 9添加了各种有用的Blade指令。

要求

安装

通过Composer安装

composer require log1x/sage-directives

用法

一旦使用Composer安装了Sage Directives,它将自动加载并准备好使用。如果指令似乎没有正确渲染,请在进一步调试或提交问题之前确保您已清除Blade缓存。

WordPress

以下指令针对WordPress核心功能。

@query

@query$query 的形式初始化标准 WP_Query,并接受数组形式的常规 WP_Query 参数

@query([
  'post_type' => 'post'
])

@posts

@posts 开始帖子循环,默认情况下假设 WP_Query 设置为 $query(使用 @query 时就是这样)。它被 have_posts() 条件包围,因此如果没有找到帖子,它将返回 null

@endposts 可用于结束循环和 have_posts() 条件,以及使用 wp_reset_postdata() 重置循环。

@query([
  'post_type' => 'post'
])

@posts
  <h2 class="entry-title">@title</h2>
  <div class="entry-content">
    @content
  </div>
@endposts

如果将 WP_Query 实例作为变量传递给 @posts,它将使用该实例。

@php
  $My_Query = new WP_Query([
    'post_type' => 'post'
  ]);
@endphp

@posts($My_Query)
  <h2 class="entry-title">@title</h2>
  <div class="entry-content">
    @content
  </div>
@endposts

如果没有定义 $query 且没有将变量传递给 @posts,它将使用来自全局 $wp_query 的主循环。

@title

@title 使用 get_the_title() 简单地输出当前帖子的标题。它也可以接受一个特定的帖子作为参数。

@title
@title(123)

@content

@content 使用 the_content() 简单地输出当前帖子的内容。

@content

@excerpt

@excerpt 使用 the_excerpt() 简单地输出当前帖子的摘要。

@excerpt

@shortcode

@shortcode 使用 do_shortcode() 简单地输出提供的短代码。

@shortcode('[my-shortcode]')

@user

@user 是一个简单的 is_user_logged_in() 条件,仅在用户登录时显示特定内容。可以使用 @enduser 关闭。

@user
  You are logged in!
@enduser

@guest

@guest 是一个简单的 !is_user_logged_in() 条件,仅在用户未登录时显示特定内容。可以使用 @endguest 关闭。

@guest
  You must be <a href="/wp-login.php">logged in</a> to view this content.
@endguest

ACF

以下指令用于与Advanced Custom Fields一起使用。如果没有安装和激活ACF,它们将不会初始化。

@field

@field 做你所期望的事情,使用 get_field() 输出指定的字段。为了帮助保持代码整洁,它还可以智能地接受参数以帮助获取特定值,如果您的字段是一个数组(例如,一个图片字段)。这是通过检查传递的第二个参数是否为字符串来完成的。

@field('text')
@field('text', 123)         // Returns the text field from post ID 123.
@field('image', 'url')      // If image is an array, returns the url value.
@field('image', 'url', 123) // If image is an array, returns the url value for post ID 123.

@hasfield

@hasfield 是一个简单的条件检查,如果指定的字段返回值。类似于 @field,它接受参数来检查数组值以及当你需要你的条件具体化时的帖子 ID。它可以通过 @endfield 来关闭。

@hasfield('list')
  <ul>
    @fields('list')
      <li>@sub('item')</li>
    @fields
  </ul>
@endfield

@hasfield('image', 'url')
  <figure class="image">
    <img src="@field('image', 'url')" alt="@field('image', 'alt')" />
  </figure>
@endfield

@isfield

@isfield 是一个简单的条件检查,用于检查字段值是否等于指定的值。作为第三个参数,它接受帖子 ID。它可以通过 @endfield 来关闭。

@isfield('cta_type', 'phone')
  <i class="fa fa-phone"></i>
@endfield

@isfield('cta_type', 'phone', 123)
  <i class="fa fa-phone"></i>
@endfield

@fields

@fields 作为处理重复字段的一个助手。它被 have_rows() 条件包装,如果它返回 true,则开始 while 循环,然后是 the_row()。它可以通过 @endfields 来关闭。

<ul>
  @fields('list')
    <li>@sub('item')</li>
  @endfields
</ul>

可选地,它可以传递一个帖子 ID

@fields('list', 123)
  [...]
@endfields

@sub

@sub 做了你期望它做的事情,使用 get_sub_field() 输出指定的子字段。它应在重复字段内部使用,例如 @fields@layout@group@options

类似于 @field,它还可以接受第二个参数,允许你在子字段是数组时返回值。更多 @sub 的例子可以在上面的重复字段示例中找到。

<ul>
  @fields('list')
    <li>@sub('item')</li>
  @endfields
</ul>

<ul class="slider">
  @fields('slides')
    <li class="slide">
      <img src="@sub('image', 'url')" alt="@sub('image', 'alt')" />
    </li>
  @endfields
</ul>

@hassub

@hassub 是一个简单的条件检查,如果指定的子字段返回值。

类似于 @hasfield,它也接受第二个参数来检查数组值。它可以通过 @endsub 来关闭。

@hassub('icon')
  <i class="fa @sub('icon')"></i>
@endsub

@hassub('image', 'url')
  <img src="@sub('image', 'url')" alt="@sub('image', 'alt')" />
@endsub

@issub

@issub 是一个简单的条件检查,如果子字段等于指定的值。它可以通过 @endsub 来关闭。

@issub('icon', 'arrow')
  <i class="fa fa-arrow-up fa-rotate-90"></i>
@endsub

@layouts

@layouts 作为处理灵活内容字段的一个助手。在底层,它与 @fields 实际上完全相同,但提供了与 @layout 一起使用的更干净、更易于阅读的代码库,@layout 调用 get_row_layout()。它可以通过 @endlayouts 来关闭。

@fields 一样,它接受帖子 ID 作为第二个参数。它可以通过 @endlayouts 来关闭。

@layouts('components')
  [...]
@endlayouts

@layouts('components', 123)
  [...]
@endlayouts

@layout

@layouthave_rows() while 循环期间作为条件检查 get_row_layout() 是否等于指定的值。

使用 @layouts,这允许你在显示你的灵活内容组件时有一个相当干净的视图。它可以通过 @endlayout 来关闭。

@layouts('components')
  @layout('card')
    <div class="card">
      @hassub('image')
        <div class="card-image">
          <img src="@sub('image', 'url')" alt="@sub('image', 'alt')" />
        </div>
      @endsub

      <div class="card-content">
        <h2>@sub('title')</h2>
        @sub('description')
      </div>
    </div>
  @endlayout

  @layout('button')
    @hassub('url')
      <a href="@sub('url')" class="button button--@sub('color') button--@sub('size')">
        @hassub('icon')
          <i class="fa fa-@sub('icon')"></i>
        @endsub
        <span>@sub('label')</span>
      </a>
    @endsub
  @endlayout

  @layout('content')
    @hassub('content')
      <div class="content">
        @sub('content')
      </div>
    @endsub
  @endlayout
@endlayouts

@group

@group 作为处理分组字段的一个助手。在底层,它与 @fields 实际上完全相同,因此作为代码可读性目的的简单别名。你更喜欢哪个完全取决于你。它可以通过 @endgroup 来关闭。

@group('button')
  @hassub('url')
    <a href="@sub('url')" class="button button--@sub('color')">
      @sub('label')
    </a>
  @endsub
@endgroup

@option

@option 使用 get_field($field, 'option') 输出指定的主题选项字段。与其他字段指令一样,它接受第二个参数,允许你在选项字段返回数组时检索值。

Find us on <a href="@option('facebook_url')" target="_blank">Facebook</a>

<div class="navbar-brand">
  <a class="navbar-item" href="{{ home_url() }}">
    <img src="@option('logo', 'url')" alt="{{ get_bloginfo('name', 'display') }}" />
  </a>
</div>

@hasoption

@hasoption 是一个简单的条件检查,如果指定的主题选项字段返回值。它可以通过 @endoption 来关闭。

@hasoption('facebook_url')
  Find us on <a href="@option('facebook_url')" target="_blank">Facebook</a>
@endoption

@isoption

@isoption 是一个简单的条件检查,如果主题选项字段等于指定的值。它可以通过 @endoption 来关闭。

@isoption('logo_type', 'svg')
  [...]
@endoption

@options

@options 作为处理主题选项中的重复和分组字段的一个助手。在底层,它与 @fields 实际上完全相同,除了它自动将主题选项 ID 'option' 传递给它。它可以通过 @endoptions 来关闭。

@hasoption('social')
  <ul class="social">
    @options('social')
      <li>
        <a href="@sub('url')" target="_blank">
          @hassub('icon')
            <i class="icon fa-@sub('icon')"></i>
          @endsub
          <span>@sub('platform')</span>
        </a>
      </li>
    @endoptions
  </ul>
@endoption

助手

以下指令是通用的辅助工具,旨在避免在不必要的情况下使用@php@endphp

@condition

@condition是一个简单的if条件,检查传递的第一个参数,如果等于true,则输出第二个参数中传递的值。

@if ($phone = App::phone())
  Call us at <a href="#">{{ App::phone() }}</a>
@endif

<a href="#" class="text @condition($phone, 'is-hidden-mobile')">
  Visit our website
</a>

@global

@global将指定的变量设置为全局。

@global($post)

@set

@set将指定的变量设置为一个指定的值。

@set($hello, 'world')

@unset

@unset删除指定的变量。

@unset($hello)

@extract

@extract将传递的数组提取到变量中。我发现这在我想在传递参数给@include时使视图可定制,同时也在视图中设置了默认值时特别有用。

// single.blade.php
@include('components.entry-meta', [
  'author' => false,
  'date'   => true,
])

// entry-meta.blade.php
@extract([
  'author' => $author ?? true,
  'date'   => $date   ?? true
])

@if ($author)
  [...]
@endif

@if ($date)
  [...]
@endif

@implode

@implode输出一个字符串,包含传递给它的数组中每个元素的表现形式,每个元素之间用粘合字符串连接。

@implode(', ' ['dog', 'cat', 'mouse', 'snake'])
// dog, cat, mouse, snake