XF 2.2 Addon templates tags documentation

[DKGE]

Hello

I am trying to learn how i build a addon.
I followed the video playlist on YouTube and checked out the developer docs.
At this point i have routes templates menus but i am not sure how to work with the ui element build in to XenForo.
You can use bootstrap inside a addon but that is not really a good solution.
For example in the video series they use <xf:form> but i am not able to find any docs that talk about that at all.
Am i just overlooking a important documentation anywhere or is it just missing?
2 professional web devs i know also looked with me and had the same trouble finding any info about it.
While we where able to find some stuff based on other addons by looking at the templates of them it doesn't really give the entire picture.

End goal for my current project is a list of items and single item pages just like the official Resource Manager addon just with a different backend to interact with a laravel api.
The backend isn't really a problem but the ui is.

Resources i found:

https://www.youtube.com/playlist?list=PL71lyEf0D9ic8GyK9AoTVH2dANbVE-KVu

Template syntax | Developer Documentation | XenForo

Developer documentation for XenForo

xenforo.com

Could someone point me in to the right direction so I can continue learning and perhaps in the future create addons which use XenForo css the right way. (Theme friendly)

First time making a thread on this forum

 

[thetechguy]

Use reverse engineering technique, that's what I usually go for. But in your case follow these steps and I think you are good to go.

• Create a route from the admin panel backend (make sure the dev mode is on from the config)
• add the public controller info while creating the route on which it will redirect
• Controller will return a view (You can check any other pub controller of the XF for the standard and format)
• Create a template of that view on the admin panel of the XF
• and you can use the CSS in the same view or can create another view for the css and include that in the parent template.

 

[DKGE]

Use reverse engineering technique, that's what I usually go for. But in your case follow these steps and I think you are good to go.

• Create a route from the admin panel backend (make sure the dev mode is on from the config)
• add the public controller info while creating the route on which it will redirect
• Controller will return a view (You can check any other pub controller of the XF for the standard and format)
• Create a template of that view on the admin panel of the XF
• and you can use the CSS in the same view or can create another view for the css and include that in the parent template.

Thanks for the info I have been trying the reverse engineer methode, that is how I got this far.

I have the routes templates and controller setup already and can view the templates inside xenforo correctly.
Just need to figure out how to use the template namespaces to start working with the xenforo elements.

Great example just below.
How would you achieve a list like this.

 

[thetechguy]

Thanks for the info I have been trying the reverse engineer methode, that is how I got this far.

I have the routes templates and controller setup already and can view the templates inside xenforo correctly.
Just need to figure out how to use the template namespaces to start working with the xenforo elements.

Great example just below.
How would you achieve a list like this.
View attachment 285509

I think you are talking about this

Template syntax | Developer Documentation | XenForo

Developer documentation for XenForo

xenforo.com

For achieving this you are already close as you already setup the route and the controller, you just need to pass the details from the controller to the view and in the view you can design using the XF macros.

There are pre-built xf macros as well which you can use to achieve easily something like this.