joomla/Component-Builder
joomla/Component-Builder
39
23
Fork 11
Code Issues 80 Pull Requests Projects 4 Wiki Activity

Updated 074 How to add Joomla Custom Fields (markdown)

Amigo 2019-10-31 06:23:17 +02:00
parent d6ac05ecb7
commit f1a7da802a
1 changed files with 6 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
074-How-to-add-Joomla-Custom-Fields.md

@ -71,6 +71,10 @@ If you forget how to use this or how to place the component, you can go to com_c
[00:17:58](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m58s) [00:17:58](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h17m58s)
???? Let me do that quickly. I'm going to grab these and place them into our component. I've copied them to a notepad. I'm going to move them to my other screen. Go back to JCB and go to my component, the Site View of a component. [00:18:23](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m23s) Open Looking, in the component we have a whole lot of things happening. We have a article comment and the title. We want the value [00:18:47](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m47s) to echo out after the title. We are going to take that first one, which is the event after the title. I'm going to place it between the header and the diff. [00:19:05](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m05s) The content is generated by it there and it's onContentAfterTitle. This is the title and it is going to show over here(see video). Then we have another one onContentBeforeDisplay. I would like to think it needs to go first before anything. I want to put that there onBeforeAnythingDisplays. That's way at the top. [00:19:39](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m39s) With contentAfterDisplay I want to put that at the very end below everything. That's quite simple. We can do more, we can wrap it in a diff. We can do all kinds of styles to it. But that's the simplest way.
Let me do that quickly. I'm going to grab these and place them into our component. I've copied them to a notepad. I'm going to move them to my other screen. Go back to JCB and go to my component, the Site View of a component. [00:18:23](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m23s) Open Looking, in the component we have a whole lot of things happening. We have a article comment and the title. We want the value [00:18:47](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h18m47s) to echo out after the title. We are going to take that first one, which is the event after the title. I'm going to place it between the header and the diff. [00:19:05](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m05s) The content is generated by it there and it's onContentAfterTitle. This is the title and it is going to show over here(see video). Then we have another one onContentBeforeDisplay. I would like to think it needs to go first before anything. I want to put that there onBeforeAnythingDisplays. That's way at the top. [00:19:39](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h19m39s) With content after display I wanna put that obviously at the very end Below everything So that's quite simple We could do more we could wrap it in a diff we could Do all kinds of styles to it But that's the simplest way and I'm just gonna demonstrate that Save and close here And then basically compile it again Install [00:20:08](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m08s) And now let's go refresh that page Oops I got some errors here I realized I'm using slightly different names then The ones I copied from the content You know the article area Content area let me show you that So They are saying up here in the comment on content before display and here it's before display content [00:20:35](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m35s) it's like a little bit Different So I'm using exactly the same So just Heads Up Use the the same as What is here in a comment And that's little me that always trying to Keep everything the same [00:20:55](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m55s) We save that it should work now So here we go simple Fields input value more fields with more input There are those values displayed on the front So if we go back here We can close this out Go back to the fields and let's say with a more fields You wanna change that to display after the title Save And then go back to the front and refresh this So now the one is up here and the other one is after the title [00:21:28](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m28s) So let's say we want simple field to actually show at the very end of our value go out of more Fields into simple field I will change that to you know After display Save and close So you could move the values Position Simply and everyone will move now you see that simple Field is below everything [00:21:55](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m55s) And if you realise This whole area here is the block So that's how the custom Fields can come to the front you can also say you know I don't want this Area to show up And you can go to To the field simple field And you could say show label hide label And save And now if you refresh it will only give you the value So [00:22:20](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m20s) That's the kind of behavioral integration So that's a quick demonstration Of how to now use Joomla custom fields in your components And how to then Model those values into the front end By Simply making use of the events And Wow have fun I'm sure this will Make things even more interesting Thanks for watching ### Demonstration
[00:20:08](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m08s)
I'm going to demonstrate that. Save and close. Compile it, install. Refresh the page. Oops I have some errors, I realized I'm using slightly different names then the ones I copied from the Article Content area. Let me show you that. They are saying in the comment onContentBeforeDisplay and here it's beforeDisplayContent. [00:20:35](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m35s) It's a little bit different. I'm using exactly the same. Just a heads up. Use the same as what is in the comment. I'm always trying to keep everything the same. [00:20:55](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h20m55s) Save that, it should work now. Simple Fields, Input Value, More Fields, With More Input. Those values are displayed on the front. If we go back to Editing The Look, we can close this out, go back to the Fields, and let's say With More Fields, you want to change that to display it After Title. Save and go back to the front, refresh this. The one is up here and the other one is after the title(see video). [00:21:28](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m28s) Let's say we want Simple Field to show at the very end of our value. Go out of More Fields and go into Simple Field. Change that to After Display. Save and close. You can move the values position. Everyone will move, you will see that Simple Field is below everything. [00:21:55](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h21m55s) Do realize this whole area is the block. That's how the Custom Fields can come to the front. You can also say, I don't want Simple Field area to show up. You can go to the Simple Field, and you can say: Show Label, Hide Label. Save and if you refresh, it will only give you the value. [00:22:20](https://www.youtube.com/watch?v=n5RBmP0uNCM&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&t=00h22m20s) That's the kind of behavioral integration. That's a quick demonstration of how to use Joomla Custom Fields in your components. How to model those values into the front-end by simply making use of the events. Wow have fun. I'm sure this will make things even more interesting.