Hi, how can I make HTML code in posts not string, but working code?

Xavier

Issue:

Hello, I want to use some code in my text, for example, <iframe>...</iframe>, or some css code just work on one particular post page. However, it appeared to be strings, and I tried to edit some part of 'forum.css', but it didn't work, how can I achieve this? Thank you 🙂

Flarum information

An example available would be on https://dl.aurorum.co/d/19-minesweeper

clarkwinkelmann

Xavier do you need the ability to insert arbitrary code, or are you trying to insert a specific website?

The recommended solution is to use the PHP extension API to create a custom bbcode or MediaEmbed configuration for your specific website, that way you don't need complicated access control to restrict which user can insert what.

Xavier

clarkwinkelmann I need the ability to insert arbitrary code, and that's why I'm not using a custom bbcode, cause there may be too many of them, and it's ok if anyone can insert working code, I'm just wondering that which file makes all the contents posted on the website cannot be recognized as working code, and how can I fix it😅，thank you for answering me.

Xavier

clarkwinkelmann emm, would what I required possible to achieve?😅

luceos

This can probably be enabled by extending the Formatter, https://s9etextformatter.readthedocs.io/Plugins/HTMLElements/Synopsis/. You can probably enable this from a local extend.php:

return [
    (new Extend\Formatter)
        ->configure(function (Configurator $configurator) {
            $configurator->HTMLEntities->allowElement('iframe');
        }),
];

Then you can add this to the post (hopefully):

<iframe id="games.iframe" name="000001" width="100%" height="600" frameborder="0" src="https://games.aurorum.co/online/000001/index.html" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" allowfullscreen="true"></iframe>

luceos

luceos One thing I forgot, make sure to clear cache through the commandline: php flarum cache:clear otherwise the formatter change won't apply.

Xavier

luceos Hello, I followed your instructions, but it shows 'An error occurred while trying to load this page. ' when I open my website, how to fix this? 😅

luceos

Xavier check your logs; I should try my own solution locally too.

luceos

Xavier I'm sorry I really should have tested, use this in your extend.php:

        (new Extend\Formatter)
            ->configure(function (\s9e\TextFormatter\Configurator $configurator) {
                $configurator->HTMLElements->allowUnsafeElement('iframe');
            }),

See my example here; https://github.com/luceos/flarum-extender-examples/blob/e7294a3593ebc38b97a4f9ec010ef65991e27ed6/extend.php#L74-L77

Edit; let me play with it a bit it needs more code.

luceos

Meh, I'm not able to get this to work, for some reason it's not allowing src, height or width with this code:

        (new Extend\Formatter)
            ->configure(function (\s9e\TextFormatter\Configurator $configurator) {
                $configurator->HTMLElements->allowUnsafeElement('iframe');
                $configurator->HTMLElements->allowAttribute('iframe', 'src');
                $configurator->HTMLElements->allowAttribute('iframe', 'height');
                $configurator->HTMLElements->allowAttribute('iframe', 'width');
            }),

Maybe @JoshyPHP can direct me (although he'll probably say not to allow iframes 🙈 ).

Xavier

luceos Thank you so much for helping me with this problem, this solved part of the problem, but brings up some new problems😅, I've tested and added the following code into 'extend.php',
return [ (new Extend\Formatter) ->configure(function (\s9e\TextFormatter\Configurator $configurator) { $configurator->HTMLElements->allowUnsafeElement('iframe'); }), (new Extend\Formatter) ->configure(function (\s9e\TextFormatter\Configurator $configurator) { $configurator->HTMLElements->allowElement('style'); }), (new Extend\Formatter) ->configure(function (\s9e\TextFormatter\Configurator $configurator) { $configurator->HTMLElements->allowElement('h1'); }), (new Extend\Formatter) ->configure(function (\s9e\TextFormatter\Configurator $configurator) { $configurator->HTMLElements->allowElement('h3'); }), (new Extend\Formatter) ->configure(function (\s9e\TextFormatter\Configurator $configurator) { $configurator->HTMLElements->allowElement('h5'); }), (new Extend\Formatter) ->configure(function (\s9e\TextFormatter\Configurator $configurator) { $configurator->HTMLElements->allowElement('i'); }),
, However, when I want to achieve the function like
<iframe id="games.iframe" name="000001" width="100%" height="600" frameborder="0" src="https://games.aurorum.co/online/000001/index.html" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" allowfullscreen="true"></iframe>
, it actually just recognized <iframe>, but none of the following part (id="games.iframe" name="000001" width="100%" height="600" frameborder="0" src="https://games.aurorum.co/online/000001/index.html" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" allowfullscreen="true")was recognized, an example is shown on https://dl.aurorum.co/d/26-test-5😅

luceos

Xavier yeah that's exactly the issue I had too 😅

Xavier

luceos Sorry, I didn't see this reply because of some internet synchronization issue😅, emm, I tried several ways, but unable to solve the problem, emm, it's not only the iframe problem, but some other element with things like src, etc. also have this issue, I've tried 'style', which also has issue just like what 'iframe' had, and I really need this function to present the website😅, if you fix this problem in the future, please please tell me about it😀😅

Cactus1805

I think you can give this extension a try: https://discuss.flarum.org/d/30310-bbcode-iframe

luceos

Cactus1805 🙈 🤣

Xavier

Cactus1805 emm, Actually, I tried this before, but it's not working, I can't find it in my Administration after installed(I ran PHP flarum cache:clear before refresh my web page), and when I try to use [iframe src=...], which is suggested by the extension, it's not working at all..., examples can be found on https://dl.aurorum.co/d/33-test-12, or https://dl.aurorum.co/d/32-test-11😅

Xavier

luceos emm, what would happen if I uninstall s9e/textformatter, I mean, can I replace it with extensions like Markdown, or something like this, by the way, I read the readme file, composer.json file, and part of the files in the 'src' filefolder of s9e/textformatter carefully, but haven't found the part that prevent users to input working HTML code.😟😅

Cactus1805

Xavier the correct BBCode rule is [iframe="URL"], not [iframe src="URL"] as you are using.

clarkwinkelmann

Xavier you can replace s9e/TextFormatter with a different implementation, but it's a lot of work.

You can't technically uninstall it though, it's a requirement of Flarum so the files will stay in vendor even if you override it from an extension.

I believe there's an old Flarum extension that allowed using HTML as the storage format, but it was incompatible with all other extensions that added formatting features.

It would be a lot less effort to create your own custom bbcode for your iframe rather than replace the whole formatting feature.

Xavier

Cactus1805 emm, it's still not working when I used [iframe="URL"]instead of the former one, examples can be found on https://dl.aurorum.co/d/34-test-13, or https://dl.aurorum.co/d/36-test-15😅