-
Notifications
You must be signed in to change notification settings - Fork 4
Additional macros
The module comes with a few helper macros. If you don't need them you can disable in the module's settings page.
Renders a link to open the admin and edit the page passed as a parameter. The edit link will be visible only to users having the right to edit the page.
The macro can't be used as an n:macro.
Parameters:
- target: the Page to edit in the admin. If it's the first parameter then can be passed simply as
$page
insteadtarget => $page
- text: text to appear on the link (default:
Edit
) - attrs: attributes to add, eg. class, data-attributes, inline style, link target, etc
- urlparams: url parameters to append to the edit link url (string)
{* all parameters with default values: target Page, text to show, attributes: CSS class, target and url parameters *}
{editlink target => $page, text => 'Edit', attrs => 'class="edit-link" target="_blank"', urlparams => '?modal=1'}
{* Edit link for $p (ProcessWire page) *}
{editlink target => $p}
{editlink $p}
{* Edit link for the page with id 1050 *}
{editlink 1050}
{* Edit link for the current $page *}
{editlink}
Setting defaults
You can set default parameters by creating a $view->editlinkDefaults
array, eg. in ready.php
:
$view->editlinkDefaults = array(
'text' => '#',
'attrs' => 'class="edit-link" target="_blank"'
);
This way all edit links will have "Edit page" text and "edit-link" class by default and open in a new window. Setting parameters on individual edit links will override these.
Styling
The rendered link has no styling, you (the developer) should take care of that with custom CSS.
Example of adding icon-only links (needs the class edit-link
, see Parameters above):
.edit-link {
all: initial;
text-indent: -9999px;
display: inline-block;
border: 5px solid transparent;
float: right;
width: 20px;
height: 20px;
opacity: 0.3;
z-index: 200;
background: transparent url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAB5UlEQVRYR+3XO2gVURAG4C9iqTZa2Ina2KTRSkER1MJCa2ttYqfgE/EBPhLfjY0Iae1UbCwFFUEbsRJUBG0UREWxFBMGZkOy3HPvZXfhFsmBhYU9O/8//8z5d3bMiNfYiPEtCgL7sQtfcQ8/5qteUmAr9mLVECX6g3OFfbdwFJ+wFt+xGT+r/b0ITOFkbvo1BIEIGoTr6zaO4ArOYD3e5f3NEoHteJYZXcb/IQj02lKBRwKh0E58xjdM43SJwCQOplwzLcGP4wGeImI9wQR24HmJwB3sxqYOwG9kjA14ixVZ2mv9mrANgUr2yLwCD6zrOIZTuFpPrN6ETQkMAo+mXpB5lyVoDB4k2iowCPxElqDYUm0IVCZTqvlA8DYKhKuFtV6suWDVcEOBtyFwAPexDl9S3wq8rkgl/+v0gvNdHMO72IONGMfhNJkSeGB+xKM8knMcmvbAe6xJq16Nf2ky0Rel1RmBIP0hP1Zhs3G9wN8B7tkZgYYu3W0JmpBYUmBJgVDgIcIrij4QE9GhnIiajmO9GnR5DqThE2HfRQIxXL7MTRdazITzMZblYBrfhy14049APLuUk2tMu3Pjc5Nzl++EU4Zrns3YC0KV/gu2YR9WtgCuXv2Nx3jVK9ai+DXrK+LIFZgFWbWDIS5SaWwAAAAASUVORK5CYII=') center center no-repeat;
background-size: cover;
}
.edit-link:hover { opacity: 1; }
Open edit link in a modal
To achieve this you'll need a JavaScript tool and adding urlparams
and attrs
to the edit link.
For example this will generate a link that can be used together with lightGallery.js.
{editlink $page, urlparams => '&modal=1', attrs => 'data-iframe="true"'}
An IF condition that sets a variable "$x" to the value of the condition. In the example below "$x" will be "$page->body", making easier to replace "body" if you need for example "title" instead.
<div n:iff="$page->body">
{$x|noescape}
</div>
{iff $page->body}
{$x|noescape}
{/iff}
Minifies markup by removing whitespace and optionally performs other tweaks. Can be applied partially to sections or individual HTML tags.
By default the macro removes whitespace between HTML tags that are not on the same line to handle situations like bold text followed by italic. This is a safe way to reduce the overall size of the markup.
Experimental features
If parameter true
is passed the macro will perform additional minifications, eg. removing quotes from attributes that has no spaces or removing default attributes like type="text"
. According to the markup these tweaks can lead to undesired results so use it only on your own risk. For advanced minification check ProCache (commercial) or AIOM.
Applying as an n:macro:
<div n:minify>
...
</div>
Applying as an inner macro to remove whitespace between li
elements:
<ul n:inner-minify>
<li n:foreach="..."></li>
</div>
Applying to a region (whole layout in this example) and enabling experimental settings (by passingtrue
):
{minify true}
<!DOCTYPE html>
...
</html>
{/minify}
If you need to switch to a page quickly, use the "page" macro. It accepts a page ID (or a selector). It automatically sets the "$p" variable too. Under the hood it uses the $pages->get() API command.
<div n:page="1039">
{$p->title}
</div>
{page 'template=home'}
{$p->title}
{/page}
Simlar to the "page" filter but returns a PageArray (loaded to "$pArr") instead of a single page. Under the hood it uses the $pages->find() API command.
<ul n:pages="'template=basic-page,limit=10'" n:inner-foreach="$pArr as $p">
<li>{$p->title}</li>
</ul>
{pages 'template=basic-page,limit=10'}
<ul n:inner-foreach="$pArr as $p">
<li>{$p->title}</li>
</ul>
{/pages}
This is an alternative to the built-in "var" macro and allows setting a variable "inline", that is, adding to a tag for example.
<div n:setvar="url,$p->url">
{$url}
</div>
- activeclass
- append, prepend
- bd, bdl, d
- bgimage
- bgset
- bodyclass
- breadcrumb
- count
- default
- embediframe
- embedyoutube
- first, last, firstkey, lastkey
- get
- getchildren
- getline, getlines
- getembedurl
- getpage
- getpages
- getparent
- group
- imageattrs
- lazy
- list
- localname
- niceurl
- onlynumbers
- optionchecked
- protectemail
- renderpager
- replacesubs
- sanitize
- savetemp
- srcset
- surround
- truncatehtml