https://github.com/getolympus/olympus-dionysos-field-link

Διώνυσος — Link field, this component is a part of the Olympus Dionysos fields for WordPress.
https://github.com/getolympus/olympus-dionysos-field-link

custom field framework jquery link olympus-zeus php twig wordpress

Last synced: 23 days ago
JSON representation

Διώνυσος — Link field, this component is a part of the Olympus Dionysos fields for WordPress.

Host: GitHub
URL: https://github.com/getolympus/olympus-dionysos-field-link
Owner: GetOlympus
License: mit
Created: 2016-04-29T12:12:17.000Z (about 9 years ago)
Default Branch: master
Last Pushed: 2023-12-20T22:31:32.000Z (over 1 year ago)
Last Synced: 2024-04-27T03:26:04.792Z (about 1 year ago)
Topics: custom, field, framework, jquery, link, olympus-zeus, php, twig, wordpress
Language: JavaScript
Homepage:
Size: 65.4 KB
Stars: 0
Watchers: 2
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        

# Dionysos Link Field

[![Olympus Component][olympus-image]][olympus-url]

[![CodeFactor Grade][codefactor-image]][codefactor-url]

[![Packagist Version][packagist-image]][packagist-url]

[![MIT][license-image]][license-blob]

> This component is a part of the **Olympus Dionysos fields** for **WordPress**.

> It uses the default `wpLink` WordPress javascript bundle to manage field.

```sh

composer require getolympus/olympus-dionysos-field-link

```

---

## Table of contents

[Field initialization](#field-initialization) • [Variables definition](#variables-definition) • [Texts definition](#texts-definition) • [Retrive data](#retrive-data) • [Release History](#release-history) • [Contributing](#contributing)

---

## Field initialization

Use the following lines to add a `link field` in your **WordPress** admin pages or custom post type meta fields:

```php

return \GetOlympus\Dionysos\Field\Link::build('my_link_field_id', [

    'title'       => 'Never gonna give you up!',

    'default'     => [

        [

            'url'    => 'https://www.youtube.com/watch?v=oVTPg9iicy4',

            'label'  => 'Never gonna get you down!',

            'target' => '_blank',

        ],

    ],

    'description' => 'You\'ve been Rick rolled!',

    'multiple'    => false,

    /**

     * Texts definition

     * @see the `Texts definition` section below

     */

    't_addblock_title'        => 'Click on the edit button',

    't_addblock_description'  => 'Click on the "+" button to add your link.',

    't_addblocks_description' => 'Click on the "+" button to add a link item.',

    't_addblock_label'        => 'Add',

    't_editblock_label'       => 'Edit',

    't_removeblock_label'     => 'Remove',

]);

```

## Variables definition

| Variable      | Type    | Default value if not set | Accepted values |

| :------------ | :------ | :----------------------- | :-------------- |

| `title`       | String  | `'Hypertext link'` | *empty* |

| `default`     | Array   | *empty* | *empty* |

| `description` | String  | *empty* | *empty* |

| `multiple`    | Boolean | `false` | `true` or `false` |

Notes:

* Set `multiple` to `true` to enable the "Add link" button

## Texts definition

| Code | Default value | Definition |

| :--- | :------------ | :--------- |

| `t_addblock_title` | Click on the edit button | Message displayed on an item without link |

| `t_addblock_description` | Click on the "+" button to add your link. | Main helper to add a single item box |

| `t_addblocks_description` | Click on the "+" button to add a link item. | Main helper to add multiple items boxes |

| `t_addblock_label` | Add | Used as an Add button area title |

| `t_editblock_label` | Edit | Used as an Edit button area title |

| `t_removeblock_label` | Remove | Used as a Remove button area title |

## Retrive data

Retrieve your value from Database with a simple `get_option('my_link_field_id', [])` (see [WordPress reference][getoption-url]).  

Below, a `json_encode()` example to understand how data are stored in Database:

```json

{

  "1": {

    "url": "https://www.google.com",

    "label": "Google.com",

    "target": "_self"

  },

  "2": {

    "url": "https://www.yahoo.com",

    "label": "Yahoo.com",

    "target": "_blank"

  }

}

```

And below, a simple example to show how to iterate on the data array in `PHP`:

```php

// Get links from Database

$links = get_option('my_link_field_id', []);

// Check if links are empty

if (!empty($links)) {

    // Build HTML list

    echo '
';

    foreach ($links as $link) {

        // Build HTML items

        echo '
';

        echo '';

        echo $link['label'];

        echo '';

        echo '';

    }

    echo '';

}

```

## Release history

| Version | Note |

| :------ | :--- |

| 0.0.22  | Add editor's button stylesheet and wp-util javascript
Update README |

| 0.0.21  | JS compatibility |

| 0.0.20  | Fix display with new remove icon |

## Contributing

1. Fork it ()

2. Create your feature branch (`git checkout -b feature/fooBar`)

3. Commit your changes (`git commit -am 'Add some fooBar'`)

4. Push to the branch (`git push origin feature/fooBar`)

5. Create a new Pull Request

---

**Built with ♥ by [Achraf Chouk](https://github.com/crewstyle "Achraf Chouk") ~ (c) since a long time.**

[olympus-image]: https://img.shields.io/badge/for-Olympus-44cc11.svg?style=flat-square

[olympus-url]: https://github.com/GetOlympus

[codefactor-image]: https://www.codefactor.io/repository/github/GetOlympus/olympus-dionysos-field-link/badge?style=flat-square

[codefactor-url]: https://www.codefactor.io/repository/github/getolympus/olympus-dionysos-field-link

[getoption-url]: https://developer.wordpress.org/reference/functions/get_option/

[license-blob]: https://github.com/GetOlympus/olympus-dionysos-field-link/blob/master/LICENSE

[license-image]: https://img.shields.io/badge/license-MIT_License-blue.svg?style=flat-square

[packagist-image]: https://img.shields.io/packagist/v/getolympus/olympus-dionysos-field-link.svg?style=flat-square

[packagist-url]: https://packagist.org/packages/getolympus/olympus-dionysos-field-link

ecosyste.ms

Data

Tools

Indexes

Applications

Experiments

Awesome

https://github.com/getolympus/olympus-dionysos-field-link

Awesome Lists containing this project

README