• Hi All,

    I am just starting with a widget/plugin and realized I am confused on two fronts, so I am hoping someone can shed some light.

    I have a separate site (not WP) that has user-generated content (posts). I want to create a way for WP users to include this content. I have developed a widget on the site and it uses three code snippets, as many widgets do:

    1) script tag to go in the header with link to external js
    2) script tag to go in body to call function from the external js (there can be multiple of these and the result would just be multiple posts shown as widgets)
    3) script tag to go after body for some final loading

    So it looks like this:

    <head><script src="head.js"></script><head>
    <body>
      <script>
        contentId="123";
        getContent();
      </script>
      <script>
        contentId="456";
        getContent();
      </script>
    </body>
    <script src="bottom.js"></script>

    So you can see that I load the head.js and bottom.js once, but may have more than one script in the body.

    The code is generated on the site and, if someone does not use WP, this would be what they user. I would look to leverage this in a WP widget.

    So my two points of confusion are:

    1) Do I first need a plugin in order to have widgets? There could be multiple widgets (pointing to different posts) on various pages. Because of this, dont think a plugin is the correct option as that would be one instance per site. If that is correct, is a plugin needed as the foundation for the widget? I am looking to make this as easy for users.

    2) Is it easier/better to just have WP users use the same widget. I know we can add javascript, but is it as convenient as a widget from the console?

    Any thoughts are appreciated as my head is spinning from research

    • This topic was modified 6 years, 9 months ago by chz516.
    • This topic was modified 6 years, 9 months ago by chz516.
Viewing 6 replies - 1 through 6 (of 6 total)
  • Moderator bcworkz

    (@bcworkz)

    To add widgets, you need to add your custom code somewhere. Your only two choices in WP are either plugins or themes. There is a sub-option of a sort for themes. Your widget code can be part of a child theme. A child theme is great for modifying a packaged theme that will occasionally be updated. If you were to directly alter a theme, its update will overwrite your efforts. Not so with a child theme. A child theme essentially tells WP “Use this other packaged theme, but apply these custom changes.”

    If you will be altering theme templates, a child theme is the best option, but a child theme ties you to a specific parent theme. If you want your code applied to a site regardless of the theme used, a plugin is your best option.

    Neither option needs to be very complicated, the needed boiler plate is minimal. Contrast that with a fully developed stand alone theme, which has quite a few requirements that must be met.

    I’m not sure why you think a plugin would be a poor choice. It’s not a problem having multiple widgets. Users can pick whichever they want and drag it into a widget area offered by their theme. Even if you were to implement a JavaScript solution, you would need one module or the other to cause the script reference to be added onto a page or post. From your description, it sounds to me like you should be using a plugin to add your widgets.

    Thread Starter chz516

    (@chz516)

    Well, its not that I think a plugin would be a poor choice so much as I think I am still a little confused between a plugin and widget.

    My understanding is that a plugin adds to the functionality of the site at the site level. And that a widget is more localized.

    So, if I am correct, then my assumption is that I need a plugin to be able to add my widgets. The plugin would be responsible for putting the js scripts at the top and bottom of the page and the widget would be the code that calls the js functions.

    But maybe I am still confused (and I dont even want to think about themes–that is an entirely new level of confusion ??

    I guess what I wonder is, is a WP plugin/widget needed. In other words, if I gave you the snippets of code above (the original post) would you easily be able to add them to your WP page? I know that if a site is not WP, its very easy. Just open the HTML page, paste the code where you need it, and all set. If it is just as easy in a WP site, is the widget needed.

    And, I agree that a boilerplate setup would probably work in my case because it is fully coded already. All the js functions, css, etc are all ready to go. Its really just a matter of leveraging that code and adhering to the WP guidelines.

    So if a WP plugin/widget is the way to go I dont think it would be hard to do, Im just still a bit confused as to WHAT to do.

    Thread Starter chz516

    (@chz516)

    Ok, just creating an example helps to make sense of this all (as expected) but one thing that has been driving me crazy for hours, how do I add an inline script?

    I have enqued the header and bottom scripts, but the middle script, the inline one, needs to be in the body–at the location where the widget is placed.

      <script>
        contentId="123";
        getContent();
      </script>

    I figured it is is “wp_add_inline_script” but that only seems to add lines to an existing registered script (such as header or bottom)

    The header script loads all the functions, now they just need to be called with some parameters.

    If I simply, wanted to add this to the widget:
    <script>alert('hello');</script>

    How would that be done? Does a js file need to be created and registered for any inline js?

    • This reply was modified 6 years, 9 months ago by chz516.
    Moderator bcworkz

    (@bcworkz)

    Plugin vs. widget is not an either/or proposition. A widget is an UI device that requires some underlying code. A plugin is one type of code container for WP. Widget code has to go somewhere. A plugin is as good as any for the most part. A child theme is another good container in some circumstances. Either one can contain widget code.

    The formal way to add JavaScript to a WP page is to register an external .js file with wp_register_script(), then enqueue it with wp_enqueue_script(). (If you don’t need to reference the script in other functions, you can enqueue without registering). You are correct that wp_add_inline_script() requires a registered script, it’s not adequate on it’s own. The biggest advantage of this process is WP can resolve various dependencies so that all script references are output in the proper order. It’s clearly way too complicated for something really simple like a Hello World alert.

    There are a couple shortcuts you can do for simple scripts. Using these can cause problems and conflicts if used for more complex situations. The simplest shortcut is to simply output your JS on a page somewhere. It can even be within post content as long as it’s within <script> tags and there are no empty lines. (The autop filter callback will corrupt code with blank lines)

    Simple script can also be added directly to theme template files, preferably templates in a child theme. But if your script is intended to work with any number of themes, template files are off the table. You can directly output script references in the head section by hooking wp_print_scripts action. You don’t have much control over where your script would appear in relation to other script, so script with dependencies cannot be referenced this way. Dependencies and other elaborate script should go through the formal enqueuing process.

    Thread Starter chz516

    (@chz516)

    Yes, the widget/plugin relationship is pretty clear after playing around a bit. So that makes complete sense.

    The simplest shortcut is to simply output your JS on a page somewhere. It can even be within post content as long as it’s within <script> tags and there are no empty lines.

    This seems to be the sticking point for me. Using a standard example it was pretty easy to add my widget. I can go to my page and add it but the only problem is it is a fairly wide widget (it is actually an iFrame that pulls part of a page from another site) so while a wide sidebar is ok, often, it will make more sense to have the widget inline with the main body of the HTML.

    I in order to add it to the main body, and not in a widget area, it requires a div and a script (unless being in WP requires a different approach, but i think you are saying it does not). If you were coding an actual HTML file, you would paste the div and script into the body wherever you want it to show up. But in a WP page, it seems you would simply, as you mentioned, put the script into the area where you write your blog content. But when I do that, it shows up as text… the same way code does in this forum–not resolved but as if it were in a PRE tag.

    Am I misunderstanding?

    Is adding inline div and script to the main body just a matter of adding it as part of the main blog text? And is that the correct way to add this to the main part (as it seems widgets can only be added to widget areas.)

    Moderator bcworkz

    (@bcworkz)

    That’s right, widgets can only be added to widget areas. What constitutes a widget area is theme dependent. It can be almost anywhere. A child theme can add additional areas. I’m not so sure about plugins, never tried it. There’s probably a way, though it might be rather hacky. It’s supposed to be a theme thing.

    In a similar manner, there’s probably a way to display a widget outside of a widget area. Never tried it, and it would be rather hacky if it can be done. It’s not intended. I’ve not had much trouble with inline scripts added through the content editor. Just mainly needing to ensure there are no blank lines. That said, it becomes part of post content and is passed to “the_content” filter and is subject to getting corrupted by plugins. The user entering the code in a post must have “unfiltered_html” capability or WP will filter out the <script> tags.

    I wouldn’t say the shortcuts I suggested are officially supported, thus may not work fully with some plugins. Usually simple scripts can be added this way. People have had trouble doing so with more elaborate scripts. Especially inline in post content. That one is definitely iffy. Inserting during the wp_print_scripts action should normally be OK if there are no dependencies.

    If your intent is to add content in the main page area that contains post content, shortcodes are a possible solution. If the added content is supposed to be between posts on an archive listing or similar, there are a few actions that fire before or after “The Loop” that can be hooked into. Widgets aren’t the only solution for adding content outside of posts. They are best suited to content that’s columnar in nature or can readily be reflowed to any width.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Create Plugin/Widget or not’ is closed to new replies.