-
-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.page
124 lines (101 loc) · 4.73 KB
/
about.page
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
---
title: Pager
description: Custom page navigation.
icon: 'M22,3H5A2,2 0 0,0 3,5V9H5V5H22V19H5V15H3V19A2,2 0 0,0 5,21H22A2,2 0 0,0 24,19V5A2,2 0 0,0 22,3M7,15V13H0V11H7V9L11,12L7,15M20,13H13V11H20V13M20,9H13V7H20V9M17,17H13V15H17V17Z'
color: '#0793a0'
author: Taufik Nurrohman
image: /lot/x/pager/index.png
type: Markdown
version: 2.0.2
...
To enable the numbered page navigation feature, find a line of code that looks like this in the `pages.php` file of your
currently active layout:
~~~ .php
<?= self::pager(); ?>
~~~
Replace that line with the code below:
~~~ .php
<?= self::pager('peek'); ?>
~~~
### Types
There are several types of page navigation available in this extension that you can use.
#### Page
A page navigation for single page view.
~~~ .php
<?= self::pager('page', [
'0' => 'nav',
'1' => null,
'2' => [],
'next' => true,
'prev' => true,
'previous' => true // Alias of `prev`
]);
~~~
Key | Accept | Description
--- | ------ | -----------
`0` | `false|null|string` | Set this value to a HTML element name to wrap the page navigation layout with a HTML element. For example, if you set this value to `'div'`, then the output will automatically be wrapped in a `'<div class="pager pager-page"> … </div>'` element.
`1` | `array|null` | _Reserved._
`2` | `array` | Use this key to add more HTML attributes to the page navigation layout wrapper. Will only work if the `0` key is set to a value other than `false` and `null`.
`next` | `bool|string` | Set this value to `false` to remove the “Next” link. If the value is a string, it will be used to change the label of the “Next” link.
`prev` | `bool|string` | Set this value to `false` to remove the “Previous” link. If the value is a string, it will be used to change the label of the “Previous” link.
`previous` | `bool|string` | This key is an alias of the `prev` key.
#### Peek
A page navigation for multiple page view with numbered page navigation style.
~~~ .php
<?= self::pager('peek', [
'0' => 'nav',
'1' => null,
'2' => [],
'chunk' => $pager->chunk,
'count' => $pager->parent->count,
'next' => true,
'part' => $pager->current->part,
'peek' => 2,
'prev' => true,
'previous' => true // Alias of `prev`
]);
~~~
Key | Accept | Description
--- | ------ | -----------
`0` | `false|null|string` | Set this value to a HTML element name to wrap the page navigation layout with a HTML element. For example, if you set this value to `'div'`, then the output will automatically be wrapped in a `'<div class="pager pager-peek"> … </div>'` element.
`1` | `array|null` | _Reserved._
`2` | `array` | Use this key to add more HTML attributes to the page navigation layout wrapper. Will only work if the `0` key is set to a value other than `false` and `null`.
`chunk` | `int` | By default, the `chunk` value of the current page is used. Specify the value manually if you are using external navigation data.
`count` | `int` | By default, the `count` value of the current page is used. Specify the value manually if you are using external navigation data.
`next` | `bool|string` | Set this value to `false` to remove the “Next” link. If the value is a string, it will be used to change the label of the “Next” link.
`part` | `int` | By default, it uses the `part` value of the current page. Specify the value manually if you are using external navigation data.
`peek` | `int` | Specify how many numeric links need to be displayed before and after the currently active numeric link.
`prev` | `bool|string` | Set this value to `false` to remove the “Previous” link. If the value is a string, it will be used to change the label of the “Previous” link.
`previous` | `bool|string` | This key is an alias of the `prev` key.
The following is an example of using the page navigation layout with external data, such as from a database:
~~~ .php
<?php
$chunk = 100;
$count = $base->row('SELECT count("id") AS "count" FROM "page" WHERE "parent" = ?', [$page->id])['count'] ?? 0;
$part = $site->part ?? 1;
echo self::pager('peek', [
'chunk' => $chunk,
'count' => $count,
'part' => $part
]);
?>
~~~
### Hooks
There are several layout hooks that you can use to modify the page navigation output through the tokenization level if
the available options are not sufficient to meet your customization needs:
~~~ .php
// Specific hook for the `page` pager type
Hook::set('y.pager.page', function ($y) {
return $y;
});
// Specific hook for the `peek` pager type
Hook::set('y.pager.peek', function ($y) {
$y[1]['description'] = [
0 => 'span',
1 => $description = i('Page %d of %d', [$y['part'] ?? 1, $y['of'] ?? 1]),
2 => ['style' => 'margin-inline-start: auto;']
];
$y[2]['aria-description'] = $description;
return $y;
});
~~~