• twitter image
  • facebook image
  • youtube image
  • linkedin image
Language: CMS Made Simple Czech CMS Made Simple France CMS Made Simple Spain CMS Made Simple Hungary CMS Made Simple Russia CMS Made Simple Netherlands

All times are UTC




Post new topic Reply to topic  [ 11 posts ] 
Author Message
 Post subject: UDT met CGSI
PostPosted: Thu Apr 19, 2018 5:02 am 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Mar 23, 2006 9:25 am
Posts: 1779
Location: The Netherlands
In de blog-artikelen maak ik gebruik van een foto-udt met daarin cgsi. In de performace reports zie ik dat de foto's in het artikel 'gewoon' worden geladen, dus zonder dat deze door CGSI worden 'gehaald'. Ter illustratie deze link voor het performance report https://gtmetrix.com/reports/www.uisge-beatha.eu/m3dQeMJS en hier de link naar het artikel https://www.uisge-beatha.eu/2018/03/Nieuwe-uitlaat-elleboog

Het lijkt erop dat er in het vullen en processen van de array iets misgaat, zie alleen niet wat. Het vb. is afgeleid van een post elders op het forum. De complete udt ziet er als volgt uit:
Code:
// Settings
// {foto file="folder/fotonaam.jpg" title="title" side="right | left"}
// Een voorbeeld:
// {foto file="Gallery/Zomer2015/Vakantie 2015/Vakantie 2015 - 52.jpg" title="Helemaal rond" side="left" alt="some text"}
//
// Defaults parameters
//
$smartimage = cms_utils::get_module('CGSmartImage'); // make sure the module is loaded
$cgblog = cms_utils::get_module('CGBlog');  // changed this line.
$gCms = cmsms();
// var_dump($cgblog);
$image_heigth = 170;
$large_size = 640;
$path = 'uploads/images/';
// $path = isset($params['file']) ? $params['file'] : 'uploads/images';
$noremote = '0';
$noembed = '0';
$noresponsive = '1';
$notag = '0';
/* CGBlog article related  (string) */
$cgblog_id = isset($params['cgblog_id']) ? $params['cgblog_id'] : '436'; //random number
//
// Get Params
$fotofile = $params['file'];
$path_parts = pathinfo($fotofile);
$fotofile = $path_parts['filename']; // name of the photo from the file-parameter
$fotofile = str_replace(' ','_',$fotofile);
$image_width = isset($params['width']) ? $params['width'] : '120';
$file = isset($params['file']) ? $params['file'] : '';
 
$title = isset($params['title']) ? $params['title'] : 'Uisge Beatha';
$alt = isset($params['alt']) ? $params['alt'].', '."Uisge Beatha, Zeilen, Watersport" : "Uisge Beatha, Zeilen, Watersport";
$side = isset($params['side']) ? $params['side'] : 'left';
$path_no_spaces = str_replace(' ', '%20', $path);
$pathfile = $path_no_spaces . $params['file'];
$image_no_space = str_replace(' ', '%20', $pathfile);
//
// build an array of params, same as the module accepts
$params = array();
//
$params['src'] = $pathfile;
$params['noresponsive'] = $noresponsive;
$params['notag'] = $notag;
$params['title'] = $title;
$params['noembed'] = $noembed;
$params['width'] = $image_width;
$params['height'] = $image_heigth;
$params['alt'] = $alt;
$params['noremote'] = $noremote;
//
//  "params: ".$params|print_r;
// echo "<br/>";
$outp = cgsi_utils::process_image($params);
$image = $outp['output'];
//
$paramshref = array();
$output = array();
$paramshref['src'] = $pathfile; 
$paramshref['noresponsive'] = $noresponsive;
$paramshref['noembed'] = 1;
$paramshref['notag'] = 1;
$paramshref['title'] = $title;

$outphref = cgsi_utils::process_image($paramshref); // reduced number of parameters for href
$href = $outphref['output'];
$href=str_replace(' ','%20',$href); // replace spaces in order to validate W3C $pathfile;

echo("<div id=\"$fotofile\" class=\"floatbox_$side floatbox\" data-fb-options=\"group:cgblog-$cgblog_id header:#socialmediashare1 caption:href\">");
     echo("<a id=\"a_$fotofile\" data-rel=\"foto_blog\" class=\"floatbox\" href=\"$href\"> $image</a>");
     if ($title) {
          echo("<span class=\"cgblog_image_title\">$title</span>");
          // echo("$bar");
     }
     echo("<span class=\"cgblog_image_c2e\">(klik voor grote foto)</span>");
echo("</div><p>");


Iemand een idee waar dit niet goed loopt?


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Fri Apr 27, 2018 10:53 am 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Mar 23, 2006 9:25 am
Posts: 1779
Location: The Netherlands
Iemand een idee waar het vullen/verwerken van de array misgaat?


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Fri Apr 27, 2018 1:53 pm 
Offline
Dev Team Member
Dev Team Member
User avatar

Joined: Wed Apr 23, 2008 7:53 am
Posts: 7478
Location: The Netherlands
Heb het even geprobeerd. Begonnen met opruimen, bomen en het bos... heb er ook meer uitgehaald omdat de popup ed bij mijn testsite natuurlijk niet werkt want die is niet geïnstalleerd. De code kan nog wel verder worden vereenvoudigd/verbeterd maar het gaat even om het testen.

Met dit werkt hier direct. De foto wordt verwerkt in CGSI en is dus verschaald!!

Code:
// {foto file="folder/fotonaam.jpg" title="title" side="right | left"}
// {foto file="Gallery/Zomer2015/Vakantie 2015/Vakantie 2015 - 52.jpg" title="Helemaal rond" side="left" alt="some text"}

$cgblog = cms_utils::get_module('CGBlog');
$smartimage = cms_utils::get_module('CGSmartImage');

$image_heigth = 170;
$image_width = isset($params['width']) ? $params['width'] : '120';
$large_size = 640;
$path = 'uploads/images/';

$noremote = '0';
$noembed = '0';
$noresponsive = '1';
$notag = '0';

$fotofile = $params['file'];
$path_parts = pathinfo($fotofile);
$fotofile = $path_parts['filename']; // name of the photo from the file-parameter
$fotofile = str_replace(' ','_',$fotofile);

$file = isset($params['file']) ? $params['file'] : '';
 
$title = isset($params['title']) ? $params['title'] : 'Uisge Beatha';
$alt = isset($params['alt']) ? $params['alt'] : "Uisge Beatha, Zeilen, Watersport";
$side = isset($params['side']) ? $params['side'] : 'left';
$path_no_spaces = str_replace(' ', '%20', $path);
$pathfile = $path_no_spaces . $params['file'];
$image_no_space = str_replace(' ', '%20', $pathfile);

$params = array();
$params['src'] = $pathfile;
$params['noresponsive'] = $noresponsive;
$params['notag'] = $notag;
$params['title'] = $title;
$params['noembed'] = $noembed;
$params['width'] = $image_width;
$params['height'] = $image_heigth;
$params['alt'] = $alt;
$params['noremote'] = $noremote;

$outp = cgsi_utils::process_image($params);
$image = $outp['output'];

echo $image;

_________________
Image

Did my post help you solving a problem at your (customers) website and it saved you many hours of work? Great!! Consider buying me a cup of coffee in return! [ Click here ]



Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Fri Apr 27, 2018 4:53 pm 
Offline
Dev Team Member
Dev Team Member
User avatar

Joined: Wed Apr 23, 2008 7:53 am
Posts: 7478
Location: The Netherlands
Deze vereenvoudigde UDT code maakt een pop-up als een "fancybox" voorbeeld (als de bijbehorende jQuery en CSS aanwezig is natuurlijk).
In jouw geval zul je wellicht een paar parameters nog moeten toevoegen en de laatste html regel moeten aanpassen.
Code:
/**
 * User Defined Tag named "Photo"
 * {Photo file='path/to/file.jpg'}
 * {Photo file='path/to/file.jpg' height='' width='' alt='' title=''}
 */

// +++++ Dependencies +++++
$cgcontentutils = cms_utils::get_module('CGContentUtils');
if ( !$cgcontentutils ) {
  echo 'ERROR: CGContentUtils module not installed';
  return FALSE;
}

$cgsmartimage = cms_utils::get_module('CGSmartImage');
if ( !$cgsmartimage ) {
  echo 'ERROR: CGSmartImage module not installed';
  return FALSE;
}

// +++++ Parameters +++++
$src = isset($params['file']) ? $params['file'] : '';
if ( empty($src) ) {
  echo 'ERROR: Missing "file" parameter';
  return FALSE;
}

if ( @!is_array( getimagesize($src) ) ) {
  echo 'ERROR: Source file is not an image';
  return FALSE;
}

$alt = isset($params['alt']) ? $params['alt'] : 'CMS Made Simple';
$title = isset($params['title']) ? $params['title'] : 'CMS Made Simple';

$thumb_heigth = isset($params['heigth']) ? $params['heigth'] : '170';
$thumb_width = isset($params['width']) ? $params['width'] : '120';
$photo_height = '800';
$photo_width = '600';

$noembed = '0';
$noremote = '0';
$noresponsive = '1';

// +++++ Create Thumbnail +++++
$params = array();
$params['alt'] = $alt;
$params['height'] = $thumb_heigth;
$params['noembed'] = $noembed;
$params['noremote'] = $noremote;
$params['noresponsive'] = $noresponsive;
$params['notag'] = '0';
$params['src'] = $src;
$params['title'] = $title;
$params['width'] = $thumb_width;

$cgsi_utils = cgsi_utils::process_image($params);
$thumb = $cgsi_utils['output'];

// +++++ Create Photo +++++
$params = array();
$params['alt'] = $alt;
$params['height'] = $photo_heigth;
$params['noembed'] = $noembed;
$params['noremote'] = $noremote;
$params['noresponsive'] = $noresponsive;
$params['notag'] = '1';
$params['src'] = $src;
$params['title'] = $title;
$params['width'] = $photo_width;

$cgsi_utils = cgsi_utils::process_image($params);
$photo = $cgsi_utils['output'];

// +++++ HTML Output +++++
echo '<a href="' . $photo . '" class="fancybox">' . $thumb . '</a>';

_________________
Image

Did my post help you solving a problem at your (customers) website and it saved you many hours of work? Great!! Consider buying me a cup of coffee in return! [ Click here ]



Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Sat Apr 28, 2018 10:09 am 
Offline
Power Poster
Power Poster

Joined: Sun Apr 19, 2009 9:33 am
Posts: 1224
Het idee van zo'n SmartImage UDT spreekt me wel aan.

Ik heb een tijdje geleden een variant gemaakt waarbij ik de 'html' in een 'generieke' designmanager template zet. De UDT schaalt meerdere afbeeldingen en geeft data door aan de template.

Hiermee blijft de UDT wat overzichterlijker en valt er ook te varieeren als je eens een andere 'html'-opmaak nodig hebt.

(Op het moment gebruikt mijn UDT maar 1 template maar een template parameter en check of de template bestaat zou een mooie uitbreiding zijn).

Misschien hebben jullie wat aan mijn voorbeeld:

https://github.com/FrontEndStudio/cmsms ... lement.php

https://github.com/FrontEndStudio/cmsms ... ent.91.tpl


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Sat Apr 28, 2018 7:55 pm 
Offline
Dev Team Member
Dev Team Member
User avatar

Joined: Wed Apr 23, 2008 7:53 am
Posts: 7478
Location: The Netherlands
Ik ga hem zeker nog verder uitwerken en een plug-in bestand van maken i.p.v. een UDT. Komt op mn blog!

_________________
Image

Did my post help you solving a problem at your (customers) website and it saved you many hours of work? Great!! Consider buying me a cup of coffee in return! [ Click here ]



Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Tue May 01, 2018 6:15 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Mar 23, 2006 9:25 am
Posts: 1779
Location: The Netherlands
Dank voor jullie reacties!

@Arnoud: mooi idee om een template te gebruiken, denk in de situatie zoals ik de udt gebruik, dat het wellicht wat 'overkill' is omdat ik foto's òf link òf rechts plaats. Maar misschien zie jij dat anders en ben daar dna wel benieuwd naar.

@Rolf: je voorbeeld enigszins aangepast naar mijn eigen situatie. Een paar dingen vallen op:
1. om een W3C-validatie te bereiken met foto's, mogen er in 'href' geen spaties staan. Haal ik de spaties uit $src, dan lijkt het erop dat $photo leeg is. realiseer me dat cgsi geen spaties in de output houdt.
2. als ik de spaties negeer en $photo heeft eenoutput vanuit CGSI aan href= voeg, dan vindt floatbox het niet leuk meer; ik vermoed dat er in $photo een " wordt geplaatst waardoor de variabele $photo verminkt wordt. Op de volgende link kan je dat zien gebeuren: https://www.cmscanbesimple.com/2018/03/Gecorrodeerde-uitlaatbocht
3. $file wordt niet herkend als foto-bestand waardoor getimagesize vindt dat deze een foutmelding moet geven. Voor nu van commentaar voorzien om het geheel te laten werken.

De code die ik met enkele aanpassingen in jouw voorbeeld van heb gemaakt is:
Code:
/**
 * User Defined Tag named "Photo"
 * {foto file='path/to/file.jpg'}
 * {foto file='path/to/file.jpg' height='' width='' alt='' title='' side=''}
 */

// +++++ Dependencies +++++
$cgcontentutils = cms_utils::get_module('CGContentUtils');
if ( !$cgcontentutils ) {
  echo 'ERROR: CGContentUtils module not installed';
  return FALSE;
}

$cgsmartimage = cms_utils::get_module('CGSmartImage');
if ( !$cgsmartimage ) {
  echo 'ERROR: CGSmartImage module not installed';
  return FALSE;
}

// +++++ Parameters +++++
$src = isset($params['file']) ? $params['file'] : '';
if ( empty($src) ) {
  echo 'ERROR: Missing "file" parameter';
  return FALSE;
}

//if ( @!is_array( getimagesize($src) ) ) {
//  echo 'ERROR: Source file is not an image';  // 01may18: source is not recognized as a photo. Reason unknown
//  return FALSE;
// }

$path = 'uploads/images';
$src = $path . '/' . $src;
$src_no_spaces = str_replace(' ','%20',$src); // replace spaces in order to validate W3C href;
$fotofile = $params['file'];
$path_parts = pathinfo($fotofile);
$fotofile = str_replace(' ','_',$path_parts['filename']); // name of the photo from the file-parameter
$cgblog_id = isset($params['cgblog_id']) ? $params['cgblog_id'] : '436'; //random number, although can't get cgblogid in UDT

$side = isset($params['side']) ? $params['side'] : 'left';

$alt = isset($params['alt']) ? $params['alt'].', '."Uisge Beatha, Zeilen, Watersport" : "Uisge Beatha, Zeilen, Watersport";
$title = isset($params['title']) ? $params['title'] : 'Uisge Beatha';

$thumb_heigth = isset($params['heigth']) ? $params['heigth'] : '170';
$thumb_width = isset($params['width']) ? $params['width'] : '120';
$photo_height = '480';
$photo_width = '640';

$noembed = '0';
$noremote = '0';
$noresponsive = '1';

// +++++ Create Thumbnail +++++
$params = array();
$params['alt'] = $alt;
$params['height'] = $thumb_heigth;
$params['noembed'] = $noembed;
$params['noremote'] = $noremote;
$params['noresponsive'] = $noresponsive;
$params['notag'] = '0';
$params['src'] = $src;
$params['title'] = $title;
$params['width'] = $thumb_width;

$cgsi_utils = cgsi_utils::process_image($params);
$thumb = $cgsi_utils['output'];

// +++++ Create Photo +++++
$params = array();
$params['alt'] = $alt;
$params['height'] = $photo_heigth;
$params['noembed'] = $noembed;
$params['noremote'] = $noremote;
$params['noresponsive'] = $noresponsive;
$params['notag'] = '1';
$params['src'] = $src;  // in case the file has no spaces, no $photo is created (seems empty)
$params['title'] = $title;
$params['width'] = $photo_width;

$cgsi_utils = cgsi_utils::process_image($params);
$photo = $cgsi_utils['output'];

// +++++ HTML Output +++++
// echo '<a href="' . $photo . '" class="fancybox">' . $thumb . '</a>';

echo("<div id=\"$fotofile\" class=\"floatbox_$side floatbox\" data-fb-options=\"group:cgblog-$cgblog_id header:#socialmediashare1 caption:href\">");
     echo("<a id=\"a_$fotofile\" data-rel=\"foto_blog\" class=\"floatbox\" href=\"$photo\"> $thumb</a>");
     if ($title) {
          echo("<span class=\"cgblog_image_title\">$title</span>");
     }
     echo("<span class=\"cgblog_image_c2e\">(klik voor grote foto)</span>");
echo("</div><p>");


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Wed May 02, 2018 1:39 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Mar 23, 2006 9:25 am
Posts: 1779
Location: The Netherlands
Toch terugkomend op de spaties. Href mag geen spaties bevatten en dat is op te lossten met {....|cms_escape:'urlpathinfo'}. Het lijkt er echter op dat GCSI de spaties die vervangen zijn door %20 eruit haalt en weer spaties van maakt, dat constateer ik als ik het volgende testje doe:
Code:
{assign var='fotos' value="{root_url}/{$file|cms_escape:'urlpathinfo'}"}

Lees ik {$foto} uit, dan zie ik de url met %20 op de plaatsen waar een spatie staat en kijk ik naar de source na deze opdracht:
Code:
......href="{CGSmartImage src={$fotos}.......
dan zijn de spaties verdwenen. Op zich niet erg, behalve dat het niet valideert bij W3C.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Wed May 02, 2018 8:46 pm 
Offline
Dev Team Member
Dev Team Member

Joined: Mon Nov 28, 2011 9:29 am
Posts: 2951
Location: The Netherlands
Niet getest maar kun je dat niet oplossen door de cms_escape te verplaatsen naar CGSI:

Code:
....href="{CGSmartImage|cms_escape:'urlpathinfo' src={$fotos}.......


?


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Wed May 02, 2018 9:36 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Mar 23, 2006 9:25 am
Posts: 1779
Location: The Netherlands
velden wrote:
Niet getest maar kun je dat niet oplossen door de cms_escape te verplaatsen naar CGSI:

Code:
....href="{CGSmartImage|cms_escape:'urlpathinfo' src={$fotos}.......


?

Creatief!

De 'speciale' karakters worden inderdaad vervangen, echter het leidt tot een 404-fout, nl. dat het bestand niet kan worden gevonden.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
 Post subject: Re: UDT met CGSI
PostPosted: Fri May 11, 2018 8:49 pm 
Offline
Power Poster
Power Poster
User avatar

Joined: Thu Mar 23, 2006 9:25 am
Posts: 1779
Location: The Netherlands
Opgelost; bij de options van Floatbox "type: image" toegevoegd en de data uri kan in de href worden opgenomen.


Top
  Profile  
 
Share On:
Share on Facebook Share on Twitter Share on Google+
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 11 posts ] 

All times are UTC


Who is online

Users browsing this forum: No registered users


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
cron
HostPapa CMS Made Simple hosting