https://github.com/murdercode/laravel-shortcode-plus
Extend your Laravel Application with Shortcode+
https://github.com/murdercode/laravel-shortcode-plus
laravel php shortcodes
Last synced: 9 months ago
JSON representation
Extend your Laravel Application with Shortcode+
- Host: GitHub
- URL: https://github.com/murdercode/laravel-shortcode-plus
- Owner: murdercode
- License: mit
- Created: 2022-10-28T10:11:30.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-12-16T10:17:12.000Z (over 1 year ago)
- Last Synced: 2024-12-21T16:57:53.689Z (over 1 year ago)
- Topics: laravel, php, shortcodes
- Language: PHP
- Homepage:
- Size: 714 KB
- Stars: 5
- Watchers: 0
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
[](https://packagist.org/packages/murdercode/laravel-shortcode-plus)
[](https://github.com/murdercode/laravel-shortcode-plus/actions?query=workflow%3Arun-tests+branch%3Amain)
[](https://github.com/murdercode/laravel-shortcode-plus/actions?query=workflow%3Aphpstan+branch%3Amain)
[](https://github.com/murdercode/laravel-shortcode-plus/actions?query=workflow%3A"Fix+PHP+code+style+issues"+branch%3Amain)
[](https://codeclimate.com/github/murdercode/laravel-shortcode-plus/maintainability)
[](https://codeclimate.com/github/murdercode/laravel-shortcode-plus/test_coverage)
[](https://packagist.org/packages/murdercode/laravel-shortcode-plus)
---
## Why Shortcode+?
This package allows you to use shortcodes in your application, like a Wordpress / BBS style
websites.
In our days, shortcodes are a great way to preserve the integrity of the data within the content
published on our site (such as a blog or forum) without risking having to rewrite the format each
time.
With Laravel Shortcode+ we have the ability to turn a standard shortcode into a dynamic asset that
can update over time (new HTML standards, cookie consent, AMP versions, and more)!
**Warning: this is a very opinionated package and it's not intended to be multi-purpose.**
## How it Works
For example, you can use the following shortcode to embed a Youtube video:
```markdown
[youtube url="https://www.youtube.com/watch?v=dQw4w9WgXcQ"]
```
This will be rendered as:
```html
```
As you can see, we don't just generate an iframe but make it accessible, performant and in line with
the best SEO practices around.
---
## Requirements
| Package Version | Requirement | Version |
|---------------------|-------------|--------------|
| 5.x.x | Laravel | 10.x or 11.x |
| 5.x.x | Nova | 4.x |
| dev-beta-laravel-12 | Laravel | 12.x |
| dev-beta-laravel-12 | Nova | 5.x |
## Installation
You can install the package via composer:
```bash
composer require murdercode/laravel-shortcode-plus
```
You can use shortcodes CSS publishing the assets:
```bash
php artisan vendor:publish --tag="shortcode-plus-assets"
```
You can publish and run the migrations with:
```bash
php artisan vendor:publish --tag="shortcode-plus-migrations"
php artisan migrate
```
You can publish the config file with:
```bash
php artisan vendor:publish --tag="shortcode-plus-config"
```
If you want to upgrade every time your assets, add in your composer.json:
```json
"scripts": {
"post-update-cmd": [
"@php artisan vendor:publish --tag=shortcode-plus-assets --ansi --force",
```
Optionally, you can publish the views using
```bash
php artisan vendor:publish --tag="shortcode-plus-views"
```
## Usage
Laravel Shortcode Plus is shipped with a default CSS and JS for a better user experience.
You can add on **resources/css/app.css** the CSS files:
```css
@import url("/public/vendor/shortcode-plus/app.css");
```
and in **resources/js/app.js** the JS files:
```js
import '/public/vendor/shortcode-plus/app2.js';
```
Now you can parse your source as follows:
```php
use Murdercode\LaravelShortcodePlus\Facades\LaravelShortcodePlus;
$html = "I want to parse this twitter tag: [twitter url=\"https://twitter.com/elonmusk/status/1585841080431321088\"]";
return LaravelShortcodePlus::source($html)->parseAll();
```
### Use Iubenda Cookie
Add in your iubenda cookie script the following code:
(/organisms/cookie-solution.blade.php)
```blade
if (purposeId === "3") {
var elements = document.getElementsByClassName('shortcode_nocookie');
for (var i = 0; i < elements.length; i++) {
elements[i].style.display = 'none';
}
}
```
#### Use Paywall with Iubenda Cookie
In config, set `cookiePaywall` to `true`
In your iubenda cookie script, add the following code:
(/organisms/cookie-solution.blade.php)
```blade
function manageShortcodePaywall() {
const shortcodesWithPaywall = document.querySelectorAll('.shortcode_with_paywall');
const paywalls = document.querySelectorAll('.shortcode_paywall');
shortcodesWithPaywall.forEach(shortcode => {
if (_iub.cs.api.isConsentGiven()) {
shortcode.style.display = 'block';
paywalls.forEach(paywall => paywall.style.display = 'none');
} else {
shortcode.style.display = 'none';
paywalls.forEach(paywall => paywall.style.display = 'block');
}
});
}
var _iub = _iub || [];
```
```blade
_iub.csConfiguration.callback.onPreferenceExpressed = manageShortcodePaywall;
_iub.csConfiguration.callback.onReady = manageShortcodePaywall;
```
```blade
<script>
var paywallPrefBtn = document.querySelector('.shortcode_paywall button');
paywallPrefBtn.addEventListener('click', function(ev) {
ev.preventDefault();
_iub.cs.api.acceptAll();
});
```
### Indexing feature
If you want to use the `[index]` shortcode, you can add the `withAutoHeadingIds()` method to your source **before**
parsing it. It will add an automatic ID to every headline (h2, h3, h4 etc...) in your source:
```php
return LaravelShortcodePlus::source($html)->withAutoHeadingIds()->parseAll();
```
This will add an ID to every heading (h2, h3, h4 etc...) in your source.
## Parsers
Here is the list of the available parsers:
| Shortcode | Description | Parameters | Example |
|----------------|-------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| `[twitter] ` | Get a Twitter card | `url` | `[twitter url="https://twitter.com/elonmusk/status/1585841080431321088"]` |
| `[bluesky] ` | Get a BlueSky card | `url` | `[bluesky url="https://bsky.app/profile/adamparkhomenko.bsky.social/post/3liz5p73u6k2f"]` |
| `[youtube]` | Get a Youtube (light) player | `url` | `[youtube url="https://www.youtube.com/watch?v=9bZkp7q19f0"]` |
| `[spotify]` | Get a Spotify player | `url` or `uri` | `[spotify url="https://open.spotify.com/track/2TpxZ7JUBn3uw46aR7qd6V"]` |
| `[faq]` | Create a `` tag with embedded content | `title` | `[faq title="What is the answer to the ultimate question?"]42[/faq]` |
| `[spoiler]` | Create a `` tag with embedded content | `title` | `[spoiler title="Spoiler"]This is hidden content[/spoiler]` |
| `[facebook]` | Get a Facebook card | `url` | `[facebook url="https://www.facebook.com/elonmusk/posts/10157744420210129"]` |
| `[instagram]` | Get a Instagram card | `url` | `[instagram url="https://www.instagram.com/p/CApQfIjBGxC/"]` |
| `[image]` | Create an image with `Image::class` model | `id`, `caption` (optional) | `[image id="123"]` |
| `[gallery]` | Create a gallery image with `Image::class` model | `title`, `images` | Single or multiple images: `[gallery title="Gallery title here" images="1"]` or `[gallery title="Gallery title here" images="1,2,3"]` |
| `[photo]` | Create a gallery image with `[Nova Media Hub](https://github.com/outl1ne/nova-media-hub)` model | `didascalia` `effect`(optional) `link`(optional) `shape`(optional) | Single or multiple images: `[photo didascalia="Gallery title here" id="1,2,3"] Effect [photo id="1,2,3" effect="carousel - juxtapose - gallery-flex" link="https://..." shape="default |rounded"]` |
| `[leggianche]` | Create a Read more div, based on `Article` or `Post` model | `id` | `[leggianche id="1"]` |
| `[distico]` | Create a side text block, based on `Article` or `Post` model | `id` | `[distico id="1"]` |
| `[button]` | Create a button that links to an URL | `link`, `label`, `level (optional)` | `[button link="https://www.google.com" label="Google" level="primary/secondary"]` |
| `[tmdb]` | Create a TMDB card | `type`, `id` | `[tmdb type="movie/tv" id="123"]` |
| `[widgetbay]` | Create a Widgetbay iframe | `id (optional)`, `link (optional)`, `forceLink (optional)`, `title (optional)` | `[widgetbay id="1"]` `[widgetbay title="Product Title" link="https://www.amazon.it/product?tag="41515&subtag="5151"..."]` |
| `[index]` | Create an automatic index based on Heading (h2, h3, h4 etc...) | none | `[index]` |
| `[trivia]` | Create a trivia | `id` | `[trivia id="1"]` |
### Note for Facebook
Please remember to call the SDK before `