Custom Html Widget

Justoverclock

0.1.3

live preview added

010101

I can't get this to work with JavaScript added. Works in the preview, but not in the frontend. I'm guessing it's a Flarum security feature or due to the whole single page app set up it can't handle it. 🤷‍♂️ I just wanted to have a new year's countdown timer in a widget. I put all the code in this. And again, in the preview it worked. But then I go to the frontend and the timer doesn't countdown. Interesting.

I don't think it's this extension, I think it's just due to the way Flarum works.

Justoverclock

010101 you can use countdown widget extension for that 🙂

Miracle

I hope It can have a "+"(add) button to add more than 1 htmlwidget(Each htmlwidget has a name label input and a html textarea).Then I can drag each of them to specific position. I wish one day you guys can make it happen.That will be more wonderful and diyable.
Thank you for this wonderful extension.

Justoverclock

Miracle this is not related with the extension itself, but is related to how afrux frameworks works 🙂

Miracle

Justoverclock Thank you. By the way, Is there any way can I build some custom html widgets and put them to different positions?

Justoverclock

Miracle if i remember well @SychO was working on a multiple widget add-on for afrux, but maybe you need to ask in that discussion, i'm not informed about his progress/spare time

Yolo

@Justoverclock this is genius!
How can I set it up so that it looks similar to the "tags" from the menu but also works in mobile mode? Is that possible?

Justoverclock

Yolo yes you can add html and css inside the <style> tag

Yolo

Justoverclock could you please post a demo code? i am not good at programming 🙁 as i said, the link shoud look als the tags above 🙂

Justoverclock

Yolo i'm nt sure about your request but you can try with

<style>
.tag {
  background-color: blueviolet;
    width: fit-content;
    border-radius: 4px;
    padding: 2px 10px 2px 10px;
    color: white;
    font-weight: bold;
}
</style>
<div class="tag">Tag Text</div>

this will generate something like this:

Yolo

Justoverclock hi!
We'd like to add an link that looks like the left side menu
example:

clarkwinkelmann

Yolo maybe this could be useful to you https://discuss.flarum.org/d/26380-custom-side-nav-links

Umutcan

The settings page of the plugin is not user-friendly, so we cannot edit it properly on mobile. Can you do a study for this?

Viblaxx

hi when I want to insert a banner with link comes the message no Permissions to do this after saving. maybe an idea what the reason could be

Justoverclock

Viblaxx can you show the code? Remember that only html and css is allowed

Viblaxx

it is probably not due to youre extension. i have the same problem with another extension where i can enter code. maybe it is due to my flarum installation.

meihuak

can I change its position in mobile browser or hide it?
now it is below the news wedget

Justoverclock

meihuak you can add display: none to that container in your css media queries

meihuak

Justoverclock thanks, I know how to do it