Support » Plugin: Polymer for WordPress » custom element

  • Resolved junal

    (@junal)


    Trying to create a custom element with block. Not exactly sure how to import. I appreciate if you let me know what I am doing wrong.

    I created a block. Named as Hello.
    <polymer-element name=”hello” noscript>
    <template>
    <h1>Hello</h1>
    </template>
    </polymer-element>

    Created a page. Choose Hello on the import block (blue higlighted).
    On the page editor <hello></hello> did not work.

    Thanks,

    john

    https://wordpress.org/plugins/polymer-components/

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Author Mattia Roccoberton

    (@blocknotes)

    Hi Junal.
    A polymer-element name requires a ‘-‘
    Try using the name “my-hello” for example.
    Reference here:
    https://www.polymer-project.org/docs/start/creatingelements.html

    Thanks for your prompt answer. But I still couldn’t get it work.

    Block name: hello
    <polymer-element name=”my-hello” noscript>
    <template>
    <h1>Hello World</h1>
    </template>
    </polymer-element>

    Created a page.
    hello was chosen. Activated as blue.
    <my-hello></my-hello> does not work. Is any code necessary to import?

    For the code block I tried different names. Hello, hello, my-hello.html…

    Sorry for bothering you with this extremely simple example.

    Thanks,

    John

    Plugin Author Mattia Roccoberton

    (@blocknotes)

    No problem. I tested personally your code and it worked.

    Block name: my-hello
    Code:

    <polymer-element name="my-hello" noscript>
    <template>
    <h1>Hello</h1>
    </template>
    </polymer-element>

    In a post I selected “my-hello” from “Import blocks” list (activated ad blue)
    Post content:

    TEST
    [poly paper-button raisedButton]Button[/poly]
    <my-hello></my-hello>

    The polymer button works.
    The block works. I see: Hello (in H1)

    Plugin Author Mattia Roccoberton

    (@blocknotes)

    Probably you missed only the right name of the block 🙂 “my-hello”
    I could put a warning somewhere to use the same one of the polymer-element and that a ‘-‘ in the name is required by Polymer.
    It should work with these conditions.

    Thanks again. The code that you sent works fine. I thought <my-hello></my-hello> would also work by itself, but it does not.

    TEST
    <my-hello></my-hello>

    Thanks for the great support.

    Best,

    John

    Plugin Author Mattia Roccoberton

    (@blocknotes)

    Good.
    ( if you like this plugin please consider to put some stars on the review 🙂 )

    Mattia,

    How can we use this plugin to develop Themes?

    John

    Plugin Author Mattia Roccoberton

    (@blocknotes)

    I think that my plugin is not a good choice for a theme because it defines the html Polymer components to load when the user save a post/page.
    In a theme I would include a copy of Polymer library because it is not a stable project yet (so you will not have problems if my plugin is updated to a new version) and you can load the components you need based on how you build the theme.

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘custom element’ is closed to new replies.