Skip to content

Commit e6b8835

Browse files
committed
Merge branch 'format/change-case' of github.com:lubusIN/blablablocks-formats into format/change-case
2 parents 9af1639 + 6d3e3ff commit e6b8835

File tree

15 files changed

+439
-291
lines changed

15 files changed

+439
-291
lines changed

.github/logo.svg

Lines changed: 34 additions & 65 deletions
Loading

README.md

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
![BlaBlaBlocks Formats](.github/banner-image.jpeg)
44

5-
[![Playground Demo Link](https://img.shields.io/badge/Playground_Demo-blue?logo=wordpress&logoColor=%23fff&labelColor=%233858e9&color=%233858e9)](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/lubusIN/blablablocks-formats/playground/_playground/blueprint-github.json)
5+
[![Getting Started Wiki](https://img.shields.io/badge/Documentation-000?style=for-the-badge&logo=googledocs&logoColor=fff)](https://github.com/lubusIN/blablablocks-formats/wiki) [![Playground Demo Link](https://img.shields.io/badge/Live%20Preview-3858e9?style=for-the-badge&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwIiBoZWlnaHQ9IjEwMCIgZmlsbD0ibm9uZSI%2BPHBhdGggZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTEuOSAzNi40MjVjLTIuMTgxIDMuMDA3LTMuMzMyIDYuNzAzLTMuNTE3IDEwLjc2NWEyNi40MyAyNi40MyAwIDAgMC0uMDE0IDEuOTk4Yy4yNzYgOS4xMzggNS4xMzQgMTkuNzggMTMuODk4IDI4LjU0NEMzNS42NzggOTEuMTQ0IDUzLjQ5MiA5NS40MSA2My41NzUgODguMWMtNC4yNDEtMS04LjUzMi0yLjU1OC0xMi43NTctNC42MzVhMjMuMDE5IDIzLjAxOSAwIDAgMS0zLjUwMi0uNDRjLTIuMTM5LS40MjctNC40LTEuMTYxLTYuNzAzLTIuMjA2LTQuMjEzLTEuOTEtOC41NjgtNC44NTctMTIuNTcyLTguODYxLTQuMDA0LTQuMDA0LTYuOTUtOC4zNTgtOC44Ni0xMi41Ny0xLjA0NS0yLjMwNC0xLjc4LTQuNTY2LTIuMjA3LTYuNzA0YTIzLjAwNiAyMy4wMDYgMCAwIDEtLjQzOS0zLjUwMWMtMi4wNzgtNC4yMjYtMy42MzYtOC41MTctNC42MzYtMTIuNzU4Wm0tOC40MDEgMjUuNDNjLjMwNS0uMzA1LjYyNS0uNTkuOTYtLjg1NGE1MC4zNzIgNTAuMzcyIDAgMCAwIDMuODY4IDguNTI2Yy0uMjE0Ljk0My0uMjYgMi4yMzUuMDg3IDMuOTY2LjY4OCAzLjQzNyAyLjgzMSA3LjY1NyA2LjYzNCAxMS40NiAzLjgwMiAzLjgwMiA4LjAyMiA1Ljk0NSAxMS40NTkgNi42MzMgMS43MzIuMzQ2IDMuMDI0LjMwMSAzLjk2Ny4wODdBNTAuMzc1IDUwLjM3NSAwIDAgMCAzOSA5NS41NDFjLS4yNjQuMzM0LS41NS42NTUtLjg1NS45Ni02LjM3OCA2LjM3OC0xOS4zMDQgMy43OTMtMjguODcyLTUuNzc0Qy0uMjk0IDgxLjE1OS0yLjg3OSA2OC4yMzMgMy41IDYxLjg1NVptMzEuNzYgMi44ODZDNTQuMzkyIDgzLjg3NSA4MC4yNDUgODkuMDQ2IDkzLjAwMSA3Ni4yOWM0LjYxMy00LjYxMyA2Ljg4MS0xMC45MzcgNi45OTQtMTguMDM3LjE5OC0xMi41MzYtNi4zMjctMjcuNDktMTguNTQzLTM5LjcwNkM2Mi4zMi0uNTg4IDM2LjQ2Ni01Ljc2IDIzLjcxIDYuOTk3Yy00LjYxOCA0LjYyLTYuODg3IDEwLjk1NC02Ljk5NCAxOC4wNjYtLjE4NyAxMi41MyA2LjMzNiAyNy40NzEgMTguNTQzIDM5LjY3OFptMjYuOTQ2IDMuMzk1Yy4zNTYgMS43NzcuNDkyIDMuMzg0LjQ1IDQuODI3LTcuMTg1LTIuNTAxLTE0LjgtNy4xNzQtMjEuNjIyLTEzLjk5Ni02LjgyMi02LjgyMi0xMS40OTUtMTQuNDM3LTEzLjk5Ni0yMS42MjMgMS40NDItLjA0IDMuMDUuMDk1IDQuODI2LjQ1IDYuMDUgMS4yMSAxMy4wODEgNC44NzMgMTkuMjc2IDExLjA2NyA2LjE5NCA2LjE5NSA5Ljg1NyAxMy4yMjYgMTEuMDY2IDE5LjI3NVpNMjkuNDg0IDEyLjc3MmMtMy40NTggMy40NTgtNS4zMDIgOS4wOC00LjM3MyAxNi41MjEgOS43ODEtLjk1IDIxLjk3MyAzLjk2NSAzMS44MDIgMTMuNzk0IDkuODI4IDkuODI4IDE0Ljc0NSAyMi4wMiAxMy43OTQgMzEuODAxIDcuNDQuOTMgMTMuMDYzLS45MTUgMTYuNTItNC4zNzIgMy44NDgtMy44NDcgNS42OTgtMTAuMzc2IDMuOTUyLTE5LjEwNC0xLjczMi04LjY2Mi02LjkxNC0xOC41MDUtMTUuNS0yNy4wOTEtOC41ODYtOC41ODYtMTguNDMtMTMuNzY4LTI3LjA5MS0xNS41LTguNzI5LTEuNzQ2LTE1LjI1Ny4xMDQtMTkuMTA0IDMuOTUxWiIgY2xpcC1ydWxlPSJldmVub2RkIi8%2BPC9zdmc%2B&logoSize=auto)](https://playground.wordpress.net/?blueprint-url=https://raw.githubusercontent.com/lubusIN/blablablocks-formats/playground/_playground/blueprint-github.json) [![WordPress Plugin Version](https://img.shields.io/wordpress/plugin/v/blablablocks-formats?style=for-the-badge&logo=wordpress&label=Install&labelColor=blue)](https://wordpress.org/plugins/blablablocks-formats/)
66

77
## Overview
88

@@ -16,28 +16,28 @@ A collection of rich text formats for the WordPress block editor with interactiv
1616

1717
## Installation
1818

19-
1. Download the latest release from GitHub
20-
2. Visit `Plugins > Add New`
21-
3. Upload the `blablablocks-formats.zip` file
22-
4. Activate `BlaBlaBlocks Formats` from plugins page
19+
### Automatic
2320

24-
## Usage
21+
1. Go to Plugins → Add New in your WordPress dashboard.
22+
2. Search for BlaBlaBlocks Formats.
23+
3. Click Install Now and then Activate.
2524

26-
### InfoTip Format
25+
### Manual
2726

28-
<!-- TODO - add recording -->
27+
1. [Download](https://github.com/lubusIN/blablablocks-formats/releases) latest release from GitHub
28+
2. Visit `Plugins > Add New`
29+
3. Upload the `blablablocks-formats.zip` file
30+
4. Activate `BlaBlaBlocks Formats` from the plugins page
2931

30-
1. Select any text in the block editor
31-
2. Click the InfoTip button in the formatting toolbar
32-
3. Configure your tooltip with custom text, colors, and overlay placement
32+
## Usage
3333

34-
### Marker Format
34+
### Available Formats
3535

36-
<!-- TODO - add recording -->
36+
- **Marker**: Add a hand-drawn style highlight to text.
37+
- **InfoTip**: Add a tooltip to any inline text.
3738

38-
1. Select text you want to highlight
39-
2. Click the Marker button in the formatting toolbar
40-
3. Choose your preferred highlighting style and animation
39+
> [!NOTE]
40+
> Refer to the [documentation](https://github.com/lubusIN/blablablocks-formats/wiki) for detailed guidance on using formats.
4141
4242
## Development
4343

@@ -77,6 +77,9 @@ npm run start # Watch for changes and auto-compile
7777
npm run serve
7878
```
7979

80+
> [!NOTE]
81+
> Refer to `package.json` for additional available npm commands.
82+
8083
## Meet Your Artisans
8184

8285
[LUBUS](http://lubus.in) is a web design agency based in Mumbai.
@@ -88,9 +91,8 @@ npm run serve
8891
## Credits
8992

9093
- [Infotip](https://thenounproject.com/icon/tooltip-383461/) icon by [Icon Island](https://thenounproject.com/iconisland) from [Noun Project](https://thenounproject.com/browse/icons/term/tooltip/) (CC BY 3.0)
91-
9294
- [Marker](https://thenounproject.com/icon/highlighter-7628276/) icon by [Muhammad Nur Auliady Pamungkas](https://thenounproject.com/mnauliady) from [Noun Project](https://thenounproject.com/browse/icons/term/highlighter/) (CC BY 3.0)
9395

9496
## License
9597

96-
BlaBlaBlocks Formats is open-sourced plugin licensed under the [MIT license](LICENSE)
98+
BlaBlaBlocks Formats is an open-sourced plugin licensed under the [MIT license](LICENSE)

_playground/blueprint-github.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"$schema": "https://playground.wordpress.net/blueprint-schema.json",
3-
"landingPage": "/wp-admin/post.php?post=1&action=edit",
3+
"landingPage": "/wp-admin/post.php?post=4&action=edit",
44
"login": true,
55
"features": {
66
"networking": true

_playground/blueprint-local.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"$schema": "https://playground.wordpress.net/blueprint-schema.json",
3-
"landingPage": "/wp-admin/post.php?post=1&action=edit",
3+
"landingPage": "/wp-admin/post.php?post=4&action=edit",
44
"login": true,
55
"features": {
66
"networking": true
@@ -21,4 +21,4 @@
2121
}
2222
}
2323
]
24-
}
24+
}

_playground/demo-content.xml

Lines changed: 28 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
>
2727

2828
<channel>
29-
<title>My WordPress Website</title>
29+
<title>Wordpress BlaBlaBlocks Formats</title>
3030
<link>https://playground.wordpress.net/scope:kind-old-city</link>
3131
<description></description>
3232
<pubDate>Mon, 28 Jul 2025 09:22:21 +0000</pubDate>
@@ -45,13 +45,37 @@
4545
<link>https://playground.wordpress.net/scope:kind-old-city/blablablocks-formats/</link>
4646
<pubDate>Mon, 28 Jul 2025 08:07:02 +0000</pubDate>
4747
<dc:creator><![CDATA[admin]]></dc:creator>
48-
<guid isPermaLink="false">https://playground.wordpress.net/scope:kind-old-city/?page_id=1</guid>
48+
<guid isPermaLink="false">https://playground.wordpress.net/scope:kind-old-city/?page_id=4</guid>
4949
<description></description>
5050
<content:encoded><![CDATA[<!-- wp:paragraph -->
51-
<p>BlablaBlocks formats bring a collection of rich text tools to the WordPress block editor—starting with interactive elements like  InfoTip  tooltips and  Marker  highlights. And there's more to come!</p>
51+
<p><strong><tatva-infotip content="A set of custom formats that add interactivity and visual emphasis to your content." overlay-placement="left-start" overlay-background-color="#503AA8" overlay-text-color="#FFEE58" icon-enabled="true" icon-type="info" class="has-infotip-format">BlaBlaBlocks formats</tatva-infotip></strong> bring a collection of rich text tools to the WordPress block editor—starting with interactive elements like <strong><tatva-marker type="double" class="has-marker-format">InfoTip</tatva-marker></strong> tooltips and <strong><tatva-marker type="double" class="has-marker-format">Marker</tatva-marker></strong> highlights. And there's more to come!</p>
52+
<!-- /wp:paragraph -->
53+
54+
<!-- wp:paragraph -->
55+
<p>With <strong><tatva-marker type="circle" class="has-marker-format">Circle</tatva-marker></strong>, you can wrap important words and make them pop.</p>
56+
<!-- /wp:paragraph -->
57+
58+
<!-- wp:paragraph -->
59+
<p><strong><tatva-marker type="double-underline" class="has-marker-format">Double Underline</tatva-marker></strong> is perfect for drawing extra focus on key phrases.</p>
60+
<!-- /wp:paragraph -->
61+
62+
<!-- wp:paragraph -->
63+
<p><strong><tatva-marker type="underline-zigzag" color="#2000ff" animation-function="steps(5, end)" class="has-marker-format">Zigzag</tatva-marker></strong> gives a creative and fun underline style for special points.</p>
64+
<!-- /wp:paragraph -->
65+
66+
<!-- wp:paragraph -->
67+
<p>Want to show edits? Use <strong><tatva-marker type="strikethrough" animation="false" class="has-marker-format">Strikethrough</tatva-marker></strong> or <strong><tatva-marker type="cross" animation="false" class="has-marker-format">Cross</tatva-marker></strong> to mark changes.</p>
68+
<!-- /wp:paragraph -->
69+
70+
<!-- wp:paragraph -->
71+
<p>Add some personality with <strong><tatva-marker type="curly" animation-function="ease" animation-duration="5" class="has-marker-format">Curly Underline</tatva-marker></strong> for a stylish touch.</p>
72+
<!-- /wp:paragraph -->
73+
74+
<!-- wp:paragraph -->
75+
<p>These tools make blogs, tutorials, and product pages look sharp and easy to follow.</p>
5276
<!-- /wp:paragraph -->]]></content:encoded>
5377
<excerpt:encoded><![CDATA[]]></excerpt:encoded>
54-
<wp:post_id>1</wp:post_id>
78+
<wp:post_id>4</wp:post_id>
5579
<wp:post_date><![CDATA[2025-07-28 08:07:02]]></wp:post_date>
5680
<wp:post_date_gmt><![CDATA[2025-07-28 08:07:02]]></wp:post_date_gmt>
5781
<wp:post_modified><![CDATA[2025-07-28 08:07:02]]></wp:post_modified>

0 commit comments

Comments
 (0)