README

此组件是WordPress中Olympus Dionysos字段的组成部分。
它使用wpColor和wpMedia WordPress JavaScript包来管理字段。

composer require getolympus/olympus-dionysos-field-background

字段初始化

使用以下代码行将背景字段添加到您的WordPress管理页面或自定义文章类型元字段中

return \GetOlympus\Dionysos\Field\Background::build('my_background_field_id', [
    'title'       => 'Ooh, got ourselves an epic now...',
    'can_upload'  => false,
    'default'     => [
        'background-attachment' => 'initial',
        'background-color'      => 'transparent',
        'background-image'      => 'https://vignette.wikia.nocookie.net/despicableme/images/1/1d/Kevin_minions.png/revision/latest/scale-to-width-down/350?cb=20170703052012',
        'background-position'   => 'left top',
        'background-repeat'     => 'no-repeat',
        'background-size'       => 'cover',
        'height'                => '200px',
        'width'                 => '100px',
    ],
    'description' => 'Oh crap, I got knocked!',
    'size'        => 'thumbnail',

    /**
     * Settings definition
     * @see the `Settings definition` section below
     */
    'settings' => [],
]);

变量定义

注意

can_upload值是通过current_user_can('upload_files')定义的（参见WordPress参考）

设置定义

settings变量是一个数组，下面定义了以下选项

检索数据

使用简单的get_option('my_background_field_id', [])从数据库中检索您的值（参见WordPress参考）。
下面是一个json_encode()的示例，以了解数据如何在数据库中存储

{
  "background-attachment": "initial",
  "background-color": "transparent",
  "background-image": "https://vignette.wikia.nocookie.net/despicableme/images/1/1d/Kevin_minions.png/revision/latest/scale-to-width-down/350?cb=20170703052012",
  "background-position": "left top",
  "background-repeat": "no-repeat",
  "background-size": "cover",
  "height": "200px",
  "width": "100px"
}

下面是一个简单的示例，展示如何在PHP中迭代数据数组

// Get background from Database
$background = get_option('my_background_field_id', []);

// Check if background is empty and display it
if (!empty($background)) {
    $style = '';

    foreach ($background as $attr => $value) {
        $style .= $attr.':'.$value.';';
    }

    echo '<div style="'.$style.'">My content</div>';
}

发布历史

0.0.3

添加高度和宽度

0.0.2

添加显示
添加JS集成

0.0.1

首次提交

贡献

分支它（https://github.com/GetOlympus/olympus-dionysos-field-background/fork）
创建您的功能分支（git checkout -b feature/fooBar）
提交您的更改（git commit -am 'Add some fooBar'）
推送到分支（git push origin feature/fooBar）
创建一个新的拉取请求

由Achraf Chouk 以♥构建 ~ 自从很久以前以来（c）。

getolympus / olympus-dionysos-field-background

维护者

详细信息