![\"settings-HTML\"](\"\/data\/content\/doc\/wordpress\/accelerator\/settings-html-accel\/settings-html-en.png\" "\\"settings-HTML")
\n<\/p>\n\n \n<\/p>\n
\n Optimizes HTML code to have a smaller size.\n <\/p>\n<\/li>\n
\n Forces the page\u2019s biggest part to being painted as earlier as possible.\n <\/p>\n<\/li>\n<\/ul>\n
\n Corrects the most common and simple errors like unescaped tags in scripts.\n <\/p>\n
\n Determining encoding of assets and converting it to HTML\u2019s encoding.\n <\/p>\n<\/li>\n<\/ul>\n<\/li>\n
\n Tries to normalize HTML markup and correct missed or wrong placed tags.\n <\/p>\n<\/li>\n
\n Tries to normalize HTML markup and correct missed or wrong placed tags by special PHP extension ‘Tidy’. This extension should be enabled on the hosting before use.\n <\/p>\n
Warning.<\/strong> It can break some tags and should be used if necessary.\n <\/p>\n<\/li>\n<\/ul>\n \n Sometimes HTML comments can contain some metainformation that is needed for page display. In this section such comments can be excluded from minification by adding regular expression<\/a> patterns. It can be added multiple expressions at once by placing each on new line.\n<\/p>\n \n In this list any XPath expressions<\/a> of needed elements and attributes can be specified. It can be added multiple expressions at once by placing each on new line.\n<\/p>\n \n E.g. expression \n It allows replacing content in raw HTML code.\n<\/p>\n \n If enabled, this replacement will apply to all pages containing HTML.\n <\/p>\n<\/li>\n \n Simple string or regular expression. Unchecking related checkbox allows to disable the element.\n <\/p>\n<\/li>\n \n If scope (element(s) XPath selector) is specified, replacement is occurred only in that elements\u2019 HTML.\n <\/p>\n Note:<\/strong> such items processed always after all items without scope.\n <\/p>\n<\/li>\n \n Replacement content.\n <\/p>\n<\/li>\n<\/ul>\n \n Unnamed group is a placeholder for replacement. To make simple insertion just use empty unnamed group like this \n Simple replacement of string ‘abc’ to string ‘bca’.\n<\/p>\n \n Inserting \u2018wpadminbar\u2019 if it is not found (conditional replacement).\n<\/p>\n \n Adding Warning:<\/strong> please, don\u2019t miss the space before the code while copying.\n <\/p>\n<\/li>\n<\/ul>\n Add<\/strong> some element (e.g. simple Add<\/strong> some element (e.g. simple Add<\/strong> some element (e.g. simple Add<\/strong> some element (e.g. simple \n On some sites there are content parts that always should be loaded without caching to show actual (fresh) content. As a result, most of content is load instantly and specified parts will be loaded with a little delay and always actual.\n<\/p>\n \n In this list any XPath expressions<\/a> of needed elements can be specified.\n<\/p>\n <\/a><\/p>\n \n To remove the display delay, you need to write <\/span> <\/a>Warning.<\/strong> Elements should always exist. If it doesn\u2019t, it can be inserted by defining related HTML replacements<\/a>.\n<\/p>\n Warning.<\/strong> Elements should be specified by its containing parent due to replacement is going only of element\u2019s children.\n<\/p>\n Warning.<\/strong> The amount of chosen parts shouldn\u2019t be variable per request. Otherwise, fresh parts can be wrong replaced. E.g. the price blocks in the product list are chosen as fresh parts. And because the list of products may change in subsequent requests, then the prices may be incorrectly replaced.\n<\/p>\n Warning.<\/strong> This approach requires fast work of server due to one per specified seconds<\/a> these elements are reloaded from original page content.\n<\/p>\n \n Here is HTML code:\n<\/p>\n <\/a><\/p>\n \n And an expression for a paragraph that has an image inside that contains \n Summary block on product page:\n<\/p>\n \n Any product lists on any page (related products, categories, etc):\n<\/p>\n \n So, now all sales, prices will be shown immediately.\n<\/p>\n \n A special efficient technology<\/a> for speeding up the loading of very large numbers of DOM elements. It is configured for each site individually.\n<\/p>\n \n In most cases all HTML should be loaded before main scripts. But can be a case when site\u2019s layout allows loading HTML parts as they displaying when scrolling.\n <\/p>\n<\/li>\n \n In this mode, <\/span>the HTML <\/span>is stored in an attribute instead of a <\/span> \n Here you can specify which parts of the pages, via their selectors (XPaths<\/a>), should be lazy loaded. Since <\/span>XPath language it is an analogue of <\/span>CSS, it allows you to make settings both for individual pages and for their set, using the principle of <\/span>CSS <\/span>selectors (classes, tags, properties, …). It can be added multiple selectors at once by placing each on new line.\n <\/p>\n \n Also, there are special parameters<\/strong> that are specified at the begin of each XPath selector. It allows to adjust behavior:\n <\/p>\n \n Always loading before main scripts. It overrides default ‘Load before non-critical scripts<\/strong>‘ setting. Values:\n <\/p>\n \n Disables.\n <\/p>\n<\/li>\n \n Enables.\n <\/p>\n<\/li>\n \n Enables loading only before main JS.\n <\/p>\n<\/li>\n<\/ul>\n<\/li>\n \n Height in CSS size of each block. E.g. \n Loading lazy HTML parts by separate request starting from specified index of lazy block. It is needed only to decrease page size if it is very large (e.g. more than 500 KB).\n <\/p>\n<\/li>\n \n Specifies chunk size when dividing to lazy loading blocks. It is 8K bytes by default.\n <\/p>\n<\/li>\n \n Specifies chunk size when dividing to lazy separated loading blocks. It is 512K bytes by default.\n <\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n \n Also, there is a special XPath function followingSiblingUpToParent<\/strong> that allows to mark below the fold content<\/strong><\/a>. First parameter is element\u2019s path where to start after that. The second optional parameter is parent element\u2019s path to search only within it. See examples below.\n<\/p>\n \n In Google Chrome browser open needed page.\n<\/p>\n<\/a>Cleanup
\n<\/h2>\n\n Comments
\n<\/h3>\n\n Elements
\n<\/h3>\n.\/\/h1<\/code> will clean all h1<\/code> tags. Or expression .\/\/h1\/@class<\/code> will clean class<\/code> attribute from all h1<\/code> tags.\n<\/p>\n<\/a>Replacement
\n<\/h2>\n\n
@<span\\sa=\"1\">()@<\/code>. Named groups can be used to extract data from source, e.g. @<span\\sa=\"(?'attr_a'[^\"]*)\">()@<\/code> with replacement ${attr_a}<\/code> puts value of attribute a<\/code> in the tag body.\n<\/p>\n\n Example 1
\n<\/h3>\n\n
abc<\/code>\n <\/p>\n<\/li>\nbca<\/code>\n <\/p>\n<\/li>\n<\/ul>\n\n Example 2
\n<\/h3>\n\n
!@\\Wid=\"wpadminbar\"@ & @()<\/body>@<\/code>\n <\/p>\n<\/li>\n<div id=\"wpadminbar\"><\/div><\/code>\n <\/p>\n<\/li>\n<\/ul>\n\n Example 3
\n<\/h3>\nfetchpriority=\"high\"<\/code> attribute to the first element with img<\/code> tag.\n<\/p>\n\n
@^<\\w+()@<\/code>\n <\/p>\n<\/li>\n(.\/\/img)[1]<\/code>\n <\/p>\n<\/li>\n\u00a0fetchpriority=\"high\"<\/code>\n <\/p>\n\n Example 4
\n<\/h3>\ndiv<\/code>) as the<\/strong> first<\/strong> element of the body<\/strong>.\n<\/p>\n\n
@<body[^>]*>()@<\/code>\n <\/p>\n<\/li>\n<div>first<\/div><\/code>\n <\/p>\n<\/li>\n<\/ul>\n\n Example 5
\n<\/h3>\ndiv<\/code>) as the<\/strong> last<\/strong> element of the body<\/strong>.\n<\/p>\n\n
@()<\/body>@<\/code>\n <\/p>\n<\/li>\n<div>last<\/div><\/code>\n <\/p>\n<\/li>\n<\/ul>\n\n Example 6
\n<\/h3>\nspan<\/code>) before<\/strong> particular<\/strong> element (e.g. the second div<\/code> in the body<\/code>).\n<\/p>\n\n
@^()@<\/code>\n <\/p>\n<\/li>\n(.\/\/body\/\/div)[2]<\/code>\n <\/p>\n<\/li>\n<span>before<\/span><\/code>\n <\/p>\n<\/li>\n<\/ul>\n\n Example 7
\n<\/h3>\nspan<\/code>) after<\/strong> particular<\/strong> element (e.g. the second div<\/code> in the body<\/code>).\n<\/p>\n\n
@()$@<\/code>\n <\/p>\n<\/li>\n(.\/\/body\/\/div)[2]<\/code>\n <\/p>\n<\/li>\n<span>after<\/span><\/code>\n <\/p>\n<\/li>\n<\/ul>\n\n Always fresh parts
\n<\/h2>\nsa:<\/code> before the expression<\/span> (‘sa’ means ‘show always’). In this case, the element will always be displayed first in its original (not fresh) form.\n<\/p>\n\n Examples
\n<\/h3>\n\n Simple
\n<\/h4>\n<p>
Some text 1\u2026
<\/p>
<p>
<img src=\"test-img-01.jpg\">
Some text 2\u2026
<\/p><\/code>\n<\/p>\ntest-img-01<\/code> in the file name: .\/\/p[.\/\/img[contains(@src, \"test-img-01\")]]<\/code>.\n<\/p>\n\n WooCommerce always fresh prices, sales, etc.
\n<\/h4>\nsa:.\/\/body[contains(concat(\" \",normalize-space(@class),\" \"),\" single-product \")]\/\/*[contains(concat(\" \",normalize-space(@class),\" \"),\" entry-summary \")]<\/code>\n<\/p>\nsa:.\/\/ul[contains(concat(\" \",normalize-space(@class),\" \"),\" products \")]<\/code>\n<\/p>\n\n Lazy load parts
\n<\/h2>\n\n
noscript<\/code> tag<\/span>, allowing, for example, using <\/span>Google Translate Cloud.\n <\/p>\n<\/li>\n\n
\n
height=100px<\/code> or height=50em<\/code>. Default is 10em.\n <\/p>\n<\/li>\n<\/a>How to setup delay loading of below the fold content
\n<\/h3>\n\n
\/\/*[@id=\"post-1\"]\/div\/p[12]<\/code>.\n<\/li>\n