Forum Discussion

alfredojahn's avatar
alfredojahn
Helper
6 years ago

How to create a custom component that doesn't use FreeMarker

I'm refining my previous post... I am new to Lithium. I need to create a custom component where I will place some HTML code. I don't really need any FreeMarker code. Can I just put plain old HTML into the component file? I assume I still need to name the file with the FTL extension? I've been going over some tutorial I found. The tutorial has you 

  1. write a component
  2. create a quilt
  3. create a skin

I'm trying to learn enough to create a component and add it to an existing quilt (page). I guess using a new quilt won't hurt. 

I have a week to determine if I can do this (create a component, add in some code from a social buttons plugin I found) and replace the current, built-in social buttons that comes with Lithium). The plugin also contains CSS. I assume I would just add that into the _styles.scss ?

Any help or suggestions would be greatly appreciated.

    • alfredojahn's avatar
      alfredojahn
      Helper
      6 years ago

      @Parshant, thanks for the response. I'm sure this is a dumb question. When I'm on a page (the page/quilt I wish to add my component too), can I get the page name from the URL? I think I have the "create component" part (sort of) figured out. I will be creating it in the SDK. Now I need to find the page to add it to. Any suggestions or tips? I'm not intimately familiar with our site. :-) 

      Thanks

      • luk's avatar
        luk
        Boss
        6 years ago

        alfredojahn for that you best go to Admin > Content > Custom Pages (left sidebar) then in that purple bar on top you click the link "Choose" to switch the node, an overlay will pop open with the community structure, there you need to find the node/page you want to have your custom component displayed on. Choose that node and the page you're on should (only if there are custom quilts available!) show a bunch of dropdowns that either say "Default" or the name of the custom quilt. That can give you a hint where to look in more complex setups.

        If you don't know or (as you say) are not very familiar with the site, you can go the reverse way and look a the particular page in the frontend where you know you want to place your custom component. Open your browser's inspector and have a look at the body-tag, the quilt-name is always there, although not a customized one (will always be "CategoryPage" for a category page, no matter if you use a quilt called "CategoryPage.Landing" or whatever).