Hi, im completely newbie here. how can i make “New Topic” button in floating? example [image]

That appears to be based on the floating button from Material Design Theme

can u please say which theme i have to use?

I can do better than that … I believe this is the CSS (UPDATED): @mixin buttonShadow { box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28); } @mixin buttonTransition { transition: right 0.5s, bottom 0.5s, border-radius 0.5s, text-indent 0.2s, visibility 1s, width 0.2s ease, height 0.5s ease 0.4s, color 0.5s, background-color 2s, transform 0.5s; } //New Topic Fab #create-topic.btn-default { display: flex; align-items: center; justify-content: center; @include buttonShadow; @include buttonTransition; padding: 0; margin: 0; width: 63px; height: 63px; border-radius: 40px; position: fixed; bottom: 30px; right: 50px; z-index: 999; background-color: var(--tertiary); color: var(--secondary); white-space: nowrap; overflow: hidden; .d-icon { margin: 0; } .d-button-label { display: inline-block; transition: all 0.3s; margin: 0 0.25em; } &:not(:hover):not(:active):not(:focus) { .d-button-label { opacity: 0; width: 0; margin: 0; } .d-icon { margin: 0 0.25em; } } } #create-topic.btn-default .fa-plus { color: var(--secondary); } #create-topic.btn-default:hover { width: 190px; }

where do i add this? i might be annoying but im new here :neutral_face:

Added a link to the Theme above. You need to go to Admin-> Customise-> Themes If adding just the CSS for the button create a Theme Component and edit the CSS for Desktop. Add the component to an existing Theme. Beginners guide to Themes here. Full developers guide here If all this is just too complex or long winded, just add the Theme I linked above following the Beginners guide :slight_smile: (PS just fixed the CSS above which was missing some dependencies)

Thank you very much sir, now how to make card view like i show in the screenshot?

I didnt realize the little red ball was the new topic and had to add the code to see here’s what I had to change original [image] modified [image] Thanks for posting I’ll be playing around with this a bit :wink:

I changed the CSS after shooting from the hip, try it now :slight_smile: You guys are just too quick! :wink: (the error is correctly identifying the missing code!)

it worked. just need this more [תמונה] David_Ningthoujam: Thank you very much sir, now how to make card view like i show in the screenshot?

Updated worked without changing :+1:

Floating "New topic" button

תמיכה

David_Ningthoujam (David Ningthoujam) 7 בדצמבר,‏ 2018,‏ 12:38pm 5

where do i add this? i might be annoying but im new here

נושא		תגובות	צפיות
How is this new topic button achieved? Product Support	4	1517	30 באוקטובר,‏ 2020
Fixed create topic/reply button in mobile? Product Support mobile	2	689	3 בנובמבר,‏ 2023
Floating "Reply" button for each topic Product Support	2	1199	13 ביוני,‏ 2020
New Topic Header Button Theme component official , new-topic-header-button	43	17229	15 בפברואר,‏ 2026
Make "New Topic" button more prominent UX	9	2025	23 ביולי,‏ 2021

Floating "New topic" button

נושאים קשורים