Add page plugin for Facebook | Community
Skip to main content
N
nikita24tailor
Level 4
August 16, 2022
Solved

Add page plugin for Facebook

  • August 16, 2022
  • 2 replies
  • 1878 views

I'm using AEM as a Cloud Service. I am creating a component which will be used to show the facebook feed of a page. The problem is that I have to add this piece of code: 

<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v14.0"></script>

I can simply add this in the component's html but it is not a standard method to use script tag inside html. For script we can write code in the ui.frontend module. So, let me know how can I add this using a standard method.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by arunpatidar

I wanted to know according to the standards of AEM. Like if the script is required to be added in ui.frontend or directly in the component's html file.


You are adding the external javascript reference which can be directly added in the component html

<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v14.0">

If you have to write your own javascript and CSS then use ui.frontend module. 

2 replies

arunpatidar
Community Advisor
arunpatidarCommunity Advisor
Community Advisor
August 16, 2022

Hi,

There is no problem with writing javascript inside body 

You can do it as component.

Arun Patidar
    N
    nikita24tailorAuthor
    Level 4
    August 16, 2022

    Can we add script tag in component's html?

      arunpatidar
      Community Advisor
      arunpatidarCommunity Advisor
      Community Advisor
      August 16, 2022

      Yes, you can do that

      https://www.w3schools.com/js/js_whereto.asp 

      Arun Patidar
        Mohit_KBansal
        Adobe Employee
        Mohit_KBansalAdobe Employee
        Adobe Employee
        August 16, 2022

        @nikita24tailor You can add custom Html/scripts in your components. Though it's advised to include such scripts in the head/footer section (based on the recommendation by the script provided), so you should consider overlaying the page component's customheaderlibs.html/customfooterlibs.html file to include this script.

          arunpatidar
          Community Advisor
          arunpatidarCommunity Advisor
          Community Advisor
          August 16, 2022

          I would not recommend to add script in head section until it is really necessary. 

           

          Adding javascript in head section can block page rendering. That is why javascript are mostly added to footer/last section of the page body.

          Arun Patidar
            Mohit_KBansal
            Adobe Employee
            Mohit_KBansalAdobe Employee
            Adobe Employee
            August 16, 2022

            @arunpatidar Thanks for pointing, I mean the same, though some scripts need to be explicitly added in the head based on recommendation (eg. jquery, launch)

              Terms & ConditionsAccessibility statement

              Loading footer...