addbutton

Generates a button that links to a page where a new article or element can be created. The button will only be created if the user is in edit mode. Therefore, the template author does not have to take care of the visibility of that button.

It is a good convention that the button is located at the top of the article or element lists before any article or element headings.

Generating a link to a new article page

It is advised to add this button to the blog page layout at the top of the articles list so the user can easily navigate to the new article page:

<p id="articles">
  {% addbutton %}

  {% for article in articles %}
    <p class="article">{{ article.title }}</p>
  {% endfor %}
</p>

Generating link to a new element page

Similarly to articles on a blog page, an add button that links to the new element page, appended before the elements list:

<div id="elements">
  {% addbutton %}

  {% for element in elements %}
    <div class="element">{{ element.title }}</div>
  {% endfor %}
</div>

If the site has more than one element type, it is recommended to provide the name of the type via the "element_type" parameter. For example, if the site has an element type named "Job board", add the tag as follows:

{% addbutton element_type="Job board" %}

Or add more like the current element:

{% addbutton element_type=element.model_name %}

You can also provide default values for the new element:

{% capture _default_values_json -%}
{"position": "developer", "salary": 9001}
{%- endcapture %}
{%- assign _default_values = _default_values_json | json_parse: editmode -%}
{% addbutton element_type="Job board" values=_default_values %}

Generating a link for some other blog or elements page

{% addbutton page_id=blog.id %}

{% addbutton page_id=element.page_id element_type=element.model_name %}

The blog context, if any, is also respected without needing to pass the page_id explicitly - see documentation for blogcontext.

Styles and classes

This tag automatically adds the "edy-site-menu-add" class to the link element so design authors can customize this button. It is also possible to add custom styles and classes to the link element by providing the "class" or "style" attributes.

{% addbutton style="background: red !important;" class="my-custom-btn" %}

Custom title

To customize the button text, you can use the "title" attribute:

{% addbutton element_type="Job board" title="Add listing" %}