Hello!
Is there any kirby solution to align a title/paragraph/image to the center/right/left/justify?
Thank you!
Do you mean in a textarea field?
If you include an image via an image tag, you can set a class and style the class in your stylesheets. As for paragraphs, you cannot add classes to paragraphs in markdown. You could, however, use a custom kirbytag. Do you want to style individual paragraphs inside a textarea field? Or all paragraphs inside a textarea field?
I tried to create a kirbytag with:
(center: start)My content(center: end)
But I was wondering in a faster and better solution as in some circumstance this tag will broke the markdown render…
It depends on what you plan to put inside that paragraph. Your custom tag could work if you do it similar to the columns plugin with a pre filter.
I’ve actually done this some time ago site/plugins/center/center.php
<?php
/**
* Center Plugin
*
* @author Jimmy Rittenborg <jimmy@sitemarina.com>
* @version 1.0.0
*/
kirbytext::$pre[] = function($kirbytext, $text) {
$text = preg_replace_callback('!\(center(…|\.{3})\)(.*?)\((…|\.{3})center\)!is', function($matches) use($kirbytext) {
$html = kirbytext($matches[2]);
return '<div class="' . c::get('center.class', 'text-center') . '">' . $html . '</div>';
}, $text);
return $text;
};
Implying that your assets/css/styles.css already has a
.text-center {
text-align: center;
}
You can then do
(center...)
Center all the texts.
(link: http://example.com link: I'm a centered link)
(...center)
and if you want to change the css class for the center container site/config/config.php
c::set('center.class', 'text--centered');
3 Likes
Thanks for sharing @JimmyRittenborg 
1 Like
Syntactically, it’s not as nice, but Markdown (and, therefore, Kirbytext) allows you to enter basic HTML:
Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
<p style="text-align: center">Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Donec sed odio dui.
This is only to say— you can keep your text compatible with other Markdown environments by limiting the number of special syntax rules.
Obviously, this is daunting for editors, but I wanted to note, in case this was a one-off situation! The other limitation, I believe, is that Markdown is not parsed inside the HTML, meaning that for any other em/ strong/inline elements would have to be hard-coded as well. 
If you enable Markdown Extra, you can even have markdown inside html tags like this:
<div markdown="1">
## Some headline
This is *true* markdown text.
</div>
2 Likes
Thank you everyone!!!
This is an old topic of course, but just updating the snippet for K3:
Kirby::plugin('custom/center', [
'hooks' => [
'kirbytags:before' => function ($text, array $data = []) {
$text = preg_replace_callback('!\(center(…|\.{3})\)(.*?)\((…|\.{3})center\)!is', function ($matches) use ($text) {
$html = kirbytext($matches[2]);
return '<div class="' . $kirby->option('center.class', 'text-center') . '">' . $html . '</div>';
}, $text);
return $text;
}
]
]);
1 Like
I’d use the option() helper instead of c::get() which is still valid code but I’m not sure if it will be deprecated in the future and we don’t use it anymore to call a config option.
Ah thank you for noting, I’ve updated the snippet accordingly!
1 Like
@waffl You have to use kirby() instead of $kirby or simply the option() helper.
with Kirby 3.9 it should look like this:
Kirby::plugin('custom/center', [
'hooks' => [
'kirbytags:before' => function ($text, array $data = []) {
$text = preg_replace_callback('!\(center(…|\.{3})\)(.*?)\((…|\.{3})center\)!is', function ($matches) use ($text) {
$html = kirbytext($matches[2]);
return '<div class="' . kirby()->option('center.class', 'text-center') . '">' . $html . '</div>';
}, $text);
return $text;
}
]
]);
1 Like