from Image SRC= to DATA-SRC= OnWebPagePrerender

discuss.answer

1,145 Posts

donshakespeare Reply #11, 10 years, 1 month ago

JUST PASTE THE CODE IN A SNIPPET, call it cuteLazyImages

$content = $input;
$dom = new DOMDocument();
$dom->loadHTML($content);
$imgs = $dom->getElementsByTagName('img');
foreach ( $imgs as $img) {
 $src = $img->getAttribute('src');
 $img->setAttribute('data-src', $src);
 $img->removeAttribute('src');
}
return $dom->saveHTML();

IN YOUR TEMPLATE, replace [[*content]] with [[*content:cuteLazyImages]]

TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.

388 Posts

ysanmiguel Reply #12, 10 years, 1 month ago

donshakespeare
mate, give me your address to send you a beer wink

Amazing mate, is not loading the images and the page is so fast... simplemente perfecto!!! Thanks a lot.

--
ysanmiguel.com

388 Posts

ysanmiguel Reply #13, 10 years, 1 month ago

Mate just one last thing, the content area filtered with :cuteLazyImages is not recognizing weird characters like accents (í, ó, ú) or something like this ( « ), it was working before... can you help me with that please?

thank you.

--
ysanmiguel.com

1,145 Posts

donshakespeare Reply #14, 10 years, 1 month ago

This is an encoding issue: try this ...

$content = $input;
$dom = new DOMDocument();
$dom->loadHTML(mb_convert_encoding($content, 'HTML-ENTITIES', 'UTF-8')); //added encoding
$imgs = $dom->getElementsByTagName('img');
foreach ( $imgs as $img) {
 $src = $img->getAttribute('src');
 $img->setAttribute('data-src', $src);
 $img->removeAttribute('src');
}
return $dom->saveHTML();

TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.

388 Posts

ysanmiguel Reply #15, 10 years, 1 month ago

Sorted!!!
Thank you very much!!!

--
ysanmiguel.com

1,145 Posts

donshakespeare Reply #16, 10 years, 1 month ago

Here is my address for that drink

24 Crates Ave Apt#12,
Beer Creek Lane, ASAP
USA 007

TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.

388 Posts

ysanmiguel Reply #17, 9 years, 11 months ago

Quote from: donshakespeare at Sep 16, 2016, 10:57 AM

This is an encoding issue: try this ...

$content = $input;
$dom = new DOMDocument();
$dom->loadHTML(mb_convert_encoding($content, 'HTML-ENTITIES', 'UTF-8')); //added encoding
$imgs = $dom->getElementsByTagName('img');
foreach ( $imgs as $img) {
 $src = $img->getAttribute('src');
 $img->setAttribute('data-src', $src);
 $img->removeAttribute('src');
}
return $dom->saveHTML();

Hello mate, I have a small question for you:

I start using the code to do the same thing on rich text fields on MigX, but I'm receiving this error:

[2016-11-07 20:29:06] (ERROR @ /home/yuser/modx/core/cache/includes/elements/modsnippet/56.include.cache.php : 4) PHP warning: DOMDocument::loadHTML(): Empty string supplied as input

do you have any idea why?

thank you very much!

--
ysanmiguel.com

1,145 Posts

donshakespeare Reply #18, 9 years, 11 months ago

I start using the code to do the same thing on rich text fields on MigX, but I'm receiving this error

How are you using it with MIGX?

TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.

388 Posts

ysanmiguel Reply #19, 9 years, 11 months ago

Quote from: donshakespeare at Nov 07, 2016, 03:06 PM

I start using the code to do the same thing on rich text fields on MigX, but I'm receiving this error
How are you using it with MIGX?

I got this code and I'm calling the migx Nested, everything works fine, I just have the error.

This is the call:

[[getImageList?
	&tvname=`dynamicOrder`
	&tpl=`tpl.dynamicOrder`
]]

The tv: tpl.dynamicOrder has something like this to pick the type of content to display, every content is another tv with migx or other type of tv inside, that means that there are different tvs in different categories in the manager, but with this "dynamicOrder" you will be able to activate, desactivate and change the order of the content that you want to display (sonds messy but I think is a good idea, I can show you if you want):

tv: tpl.dynamicOrder

]
{"field":"tv","caption":"Categorie", "inputTVtype":"listbox","inputOptionValues":"Main Image==Main Image||Main Content==Main Content||Content Extra==Content Extra||Slideshow==Slideshow||Map==Map||Gallery==Gallery"}
]

The tpl: tpl.dynamicOrder will display the chunk $contentExtra once is selected:

[[+tv:is=`Content Extra`:then=`[[$contentExtra`]]`]]

inside the chunk: $contentExtra I got the other migx call:

[[getImageList?
	&tvname=`dynamicExtraContent`
	&tpl=`tpl.dynamicExtraContent`
]]

Tv: dynamicExtraContent :

[
	{"field":"description","caption":"Content","inputTVtype":"richtext"}
]

TPL: tpl.dynamicExtraContent`

[[+description:notempty=`
	</div>
	[[+description:cuteLazyImages]]  // AND HERE IS WHERE I'M CALLING THE CODE!!!
	</div>
`]]

:) Hope you understand mate!!!

Thank you very much for your help.

--
ysanmiguel.com

Answered from Image SRC= to DATA-SRC= OnWebPagePrerender