Search the Community

Showing results for tags 'images'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Welcome to ProcessWire
    • News & Announcements
    • Showcase
    • Wishlist & Roadmap
  • Community Support
    • Getting Started
    • Tutorials
    • FAQs
    • General Support
    • API & Templates
    • Modules/Plugins
    • Themes and Profiles
    • Multi-Language Support
    • Security
    • Jobs
  • Off Topic
    • Pub
    • Dev Talk

Product Groups

  • ProDrafts
  • ListerPro
  • ProFields
  • ProCache
  • Form Builder
  • Likes
  • ProDevTools
  • Custom Development

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests

Found 170 results

  1. Hi My first use of repeaters. They seem very useful, but I'm having a strange problem with the descriptions of the images field. I can't change them after deploying from my local dev server to the live server. I have defined a repeater with one images field and one textarea (multi language) field. This works as expected when added to a template and on the page I add an image and text in 3 languages. I usually populate the image description fields with a caption text in 3 languages so that I can output a caption if required under the image. Now this all works a treat on my test localhost server, but when deployed to the live site the captions cannot be changed on these repeater image fields. If I login to the live site and change the image text in there - as soon as I hit save the text goes back to what it was before! I am logged in as superuser so can't work out what the problem is. I had a search through the forums but couldn't find a similar problem. Any ideas where to look for some clues to what the problem may be? I'm using ProcessWire 3.0.96 Many thanks - Paul
  2. jacmaes

    One of PW 3.010's major novelty was the introduction of Horst's new image resizing engine that uses ImageMagick. Now I understand that ImageMagick can convert images to Webp, the image format that Google says can reduce image size up to 34% compared to JPEG. Mozilla is apparently adding support to Firefox, and even the Safari team is playing with it, so it looks like Webp is soon going to be available in most major browsers. If Horst's module can be extended to add Webp conversion, that would be a great addition to PW's already very powerful image manipulation arsenal. I'm currently using the free ImageEngine Lite to serve Webp images to supporting browsers, and the results are impressive. I routinely get images that are between 25 and 60% smaller compared to JPEG, with the same visual quality. I would love to eliminate the need to rely on a third-party service though.
  3. rolisx

    Hi all I have a problem here. I created a gallery with 240 pictures. Created an images field with no maximum amount (0). Unfortunately, only 98 of the 240 images show on the website. Any idea what I possibly could have done wrong? Thanks for your help! <?php foreach ($page->images as $image) { $options = array( 'quality' => 90, 'upscaling' => false ); $thumb = $image->size(250, 250, $options); ?> <div class="col-xl-2 col-lg-3 col-md-4 col-sm-6 col-6 foto"> <a href="<?= $image->url ?>" data-lightbox="lightbox" > <img src="<?= $thumb->url ?>" alt="" > </a> </div> <?php } ?>
  4. Hi there, I migrated my site from dev to live server. Copied all files in the new location, transferred MySQL db from dev to live. The site works properly, but the images not. Even the processwire logo in control panel is not visible: is it something related with files permissions? Is there an easy way to solve this issue? EDIT: if I update a page via control panel, adding a new image, the thumbnail is blank...
  5. derelektrischemoench

    Hi guys, I'm trying to resize images which I query through getRandom(). I can't seem to get it right though. What I have so far is: $randomImage = $pages->get($targetPageId)->images->getRandom() Which returns an image, albeit in original resolution. I assumed I should be able to call resize() on the image like so: $randomImage = $pages->get($targetPageId)->images->getRandom()->width(400) Which unfortunately gives me an exception. I assume this is because getRandom() might not return an image but something else(?). So how would I do this correctly? Greetings derelektrischemoench
  6. louisstephens

    Ill be honest, I am a bit unsure how accomplish this. I have a repeater (dev_repeater) that contains an image field set to 1 image. Nested within this repeater, is another repeater (dev_child_repeater) that allows a user to add in some urls. However, there is also a hidden field that I am trying to pass the parent repeater's image path. I know I can output all the data by using: <?php foreach($page->dev_repeater as $repeater) { foreach($repeater as $url) { # do some stuff } } ?> For the life of me, I can not figure out how to obtain the image url in my php to pass to a variable inside the nested foreach loop. Hopefully this made some sense.
  7. Hi, I have a template that it's working fine in development, however I can't get it to work on production! It shows every information inside repeater fields except the images. Here's the template: These are the circuit_day_image settings: This is the code: <?php foreach($page->circuit_days as $circuit_day) { if($circuit_day->circuit_day_image) { $day_image = $circuit_day->circuit_day_image->size(300, 300)->url; echo '<img src="' . $day_image . '" />'; } else { echo 'No image! :('; } echo '<h2>' . $circuit_day->title . '</h2>'; echo $circuit_day->body; } ?> I always get "No image! :(" I think I'm doing everything right! Anyone else with a similar problem? Update After uploading the production database into my server, the images stopped working. It can be one of two problems: 1. Bad field configuration; 2. Something wrong with the Database. I can't find the problem. Any suggestion is welcome, thanks, Update 2 I forgot to upload the images. It's working on dev and not on production. Still no clue! Clue 1 When I insert <pre><?php print_r($circuit_day); ?></pre> On development I get a clean list for each repetition: However, on production, the command gets on a weird recursive loop that takes forever (it even slows the browser to a halt): What might be going on?
  8. I'm wondering if it is possible to add a label to the description input in image fields (in the admin). I'm using the module Image Extra, which has labels for each input, but I'd like to add a label to the default 'description' input too. The image below illustrates this: If there is no way (no hook?) then, I suppose I could just not use the default description and add a new description input with the Image Extra module. But I thought I'd ask in case I (or others) ever want to do this without using the module (i.e. just the one input required). I'm using PW 3.0.98 Thanks. --- FYI: yes, that is a cat and not a quilt -- this is on my local dev server and I don't have the actual photos yet! She is on a quilt, so it counts... technically.
  9. Hi, I'm sort of an intermediate beginner but already quite familiar with PW for a year or so. Now I'm trying to modify the new blog site profile which I find great and quite intuitive (thanks alot Ryan and crew!). I am seeking help for this problem: I want is to display a thumbnail image for every item of the description list navigation which is part of the basic page template, seen at the bottom of the about-page in the live demo here. The regarding function in _uikit.php is ukDescriptionListPages on Line 588 which is called with ukDescriptionListPages(page()->children) by the basic page template. here, in Line 612 in ukDescriptionListPages I inserted this (in red): $dt = "<a href='$item->url'><img src='$item->thumbnail->url'></a>"."<a href='$item->url'>$dt</a>"; (where "thumbnail" is the name of my new thumbnail field in the basic page template. I limited my thumbnail field to one single image). But this only gives me back the name of my thumbnail image file, followed by the string "->url" - but not the path to the image. How do I get the full path / url? Whats wrong with my code? I admit I do not fully understand all of the details in ukDescriptionListPages-function and the also involved ukMergeOptions. I suspect I would somehow have to iterate through the images of my thumbnail field since it potentially could contain more than one image (or at least use thumbnail->first->url which doesn't work in the above setting either), but how and where? Or do I have to add some argument when calling ukDescriptionListPages? It would be great to have a built-in "show thumbnail - yes or no"-option in ukDescriptionListPages in the future. Thanks in advance for any help! Markus
  10. I have a template that includes an image field that supports multiple images. The images uploaded to this field include a description field. If one of these images is embedded into a textarea field (i.e. Body), should the image description will be inserted into the image's alt attribute when embedding the image? I always assumed that it would, but there is a separate option to add an alt attribute when inserting the image. Is the purpose of the description field purely for use with the API and unnecessary for images that are intended to be embedded within a textarea field? I guess I need clarification as to how this works. Either something changed, or I never understood the differences between the image description and the alt attribute as it is used in ProcessWire. I'm currently using ProcessWire 3.0.15.
  11. Hello, I am currently playing around to build my first module. It will be a simple module for the ImageOptim web service, but I am a little bit stuck on which right hook to use. Currently I use following hook: $this->pages->addHookAfter('saveFieldReady', $this, 'imageOptimSave'); I would like to pass images and its variations to the web service after adding them to the image field. But if I use the saveFieldReady hook only the original image will be optimized, not the API generated image variations, because they will be generated after viewing the page for the first time. Can anybody please help me how to hook into the image variations? I already tried to use my own method, but this one used in the template would be called on every page render. Regards, Andreas
  12. Hello! Can I deactivate the renaming feature of images and the editing (croping, rotating etc) in the processwire admin panel?
  13. I have a file I want to access with ajax: The purpose of this file is to iterate through a repeater, and get the image from each entry. The number of images in the image field is set to 1, and just for good measure, to return a single image. And my code: // site/ajax/processImage.ajax.php?group=1206 require_once($_SERVER['DOCUMENT_ROOT'].'/index.php'); $resourceGroup = (int) $_REQUEST['group']; // get the Repeater field $resources = $pages->get($resourceGroup)->resources; foreach ($resources as $resource) { echo $resource->title; // Works as expected echo $resource->image->url; // /site/assets/files/1259/ echo $resource->image; // filename.jpg echo $resource->image->description; // nothing } See comments above for what is output, why isn't URL giving me a full URL, and no description is available? If I try to access $image->size() I get the following fatal error: Error: Uncaught exception 'ProcessWire\WireException' with message 'Method Pageimages::size does not exist or is not callable in this context' in F:\sites\<sitename>\wire\core\Wire.php:519
  14. Hi, I'm having problems to insert images on a Ckeditor body field. The images are uploaded to a image field and the page is saved. When I do clic in Ckeditor Image button I get: Failed to init module: ProcessPageEditImageSelect - No page specified The requested process does not exist The process returned no content. I'm using the superuser account. Processwire version: 3.0.79 This is the first time I get an error in Processwire... Thank you.
  15. Robin S

    An experimental module for adding images to a field via pasting one or more URLs. Add Image URLs Allows images to be added to an images field by pasting URLs. Usage Install the Add Image URLs module. A "Paste URLs" button will be added to all image fields. Use the button to show a textarea where image URLs may be pasted, one per line. Images are added when the page is saved. https://github.com/Toutouwai/AddImageUrls
  16. Hi all, I am working on a site which involves a lot of image upload fields, 99% of the time it works perfectly but I have noticed that every so often image variations will be missing. Like the original uploaded image is fine but maybe 1 or 2 out of the variations is just blank. The variation files will appear within the assets folder but they will be just in name only without any actual image content. Since its quite a random thing I am finding it rather difficult to figure out why this happens? Any ideas?
  17. Is there a way to change the input options for the images field? I am trying to figure out if it would make sense to use an external script like Zenphoto as a central media library/manager. How could I connect that with Processwire? 'Choose File' in the images field would have to be able to open that 3rd party media library or a directory on the server or some cloud service instead of (only) the client file manager. Could justb3a's field type module Image Extra be part of the solution? I will try that and report back. Other field types/modules? I know there is a pro module Media Manager that does look very slick, but would prefer to make this work with a mature, tested 3rd party script if a central media gallery is never going to be a core Processwire feature.
  18. Processwire allows us to define predefined tags for images. What if I want to use a repeater field on the page for the purpose? How can I use values of this repeater field as the list of available tags for image fields? Thanks.
  19. Peter Knight

    I have the following code which creates a 2 column div. In the first I check to see if there are any images present and only echo an image if there is. If I don't do this, I get an error. But I was wondering if there was a more efficient way to do this? I don't know the proper terminology but I suspect breaking the code into three parts as I have done ... First - the first <div class='uk-width-1-2@s'> Second - the image check Third - the final div ...is somewhat more verbose than it needs to be with more modern PHP <?php $imgoptions = array('quality' => 100,'upscaling' => false); $products = $page->siblings("id!=$page"); foreach ($products as $prod){ echo" <div class='uk-width-1-2@s'> "; if(count($prod->images)){ echo" <a href='$prod->url'> <img class='lazyload prod-thumb-ov' src='{$prod->images->first()->height(300, $imgoptions)->url}' data-src='{$prod->images->first()->height(300, $imgoptions)->url}' data-srcset=' {$prod->images->first()->width(414)->url} 414w, {$prod->images->first()->width(320)->url} 320w' data-sizes='auto' alt='{$prod->images->first()->description}'> </a> ";} echo " </div> <div class='uk-width-1-2@s'> {$prod->title} </div> ";} ?> Thanks
  20. Reference: PW 3.0.62 and uikit3 based site using the Regular-Master profile. I wonder if anyone has come across the problem of displaying images within the <figure> element before. When editing a page: If an image is added inside <p></p> tags without any align assigned, it displays normally at the size the user has specified. See screen grab example 1. If an image is placed inside the <figure> element and left or right alignment applied, the size the image is displayed as in the editing view is significantly reduced. See screen grab example 2. If an image is placed inside the <figure> element and center alignment applied, the size the image completely disappears in the editing view with only the caption text showing. See screen grab example 3. The code used to display an image in <p></p> tags without aligment assigned is standard: <p><img alt="" src="/<path-to-image>/image.jpg" width="128" /></p> Examples of the code automatically being generated by PW3/UiKit3 from within the image editing interface are: <figure class="align_left"><img alt="" src="/<path-to-image>/image.jpg>" width="128" /> <figcaption>Caption text</figcaption> </figure> <figure class="align_right"><img alt="" src="/<path-to-image>/image.jpg>" width="128" /> <figcaption>Caption text</figcaption> </figure> <figure class="align_center"><img alt="" src="/<path-to-image>/image.jpg>" width="128" /> <figcaption>Caption text</figcaption> </figure> Important Note: The images and and captions actually do display correctly when the website is browsed, but from the editing perspective it is not practical. Any thoughts or advice would be appreciated.
  21. How to automatically rename the image files to a random string during the upload process? For example, I have an image named "big_poster.jpg" and I want it to be saved as something random, for example "2680542675157_cc7m541v_l.jpg"
  22. Hi! I have a problem with uploading animated GIFs again. The upload starts, but never finishes and just loads forever. Iam running PW 3.0.62 and have the Image Animated GIF Module installed. I also increased the memory limit in the htaccess file in PW root directory like this: <IfModule mod_php5.c> php_value memory_limit 256 php_value upload_max_filesize 64M php_value post_max_size 64M php_value max_execution_time 300 php_value max_input_time 1000 </IfModule> I had this problem before, but was able to fix it with the Animated GIF Module and the modification of the htaccess file. So maybe this is related to the provider (strato). Here is the error I get, when uploading the GIF (1.1 MB filesize) Warning: preg_match_all() expects at least 3 parameters, 2 given in /mnt/web216/a2/50/51925650/htdocs/processwire/wire/core/PWGIF.php on line 252 Warning: preg_match_all() expects at least 3 parameters, 2 given in /mnt/web216/a2/50/51925650/htdocs/processwire/site/assets/cache/FileCompiler/site/modules/ImageAnimatedGif/ImageAnimatedGif.module on line 285 Warning: preg_match_all() expects at least 3 parameters, 2 given in /mnt/web216/a2/50/51925650/htdocs/processwire/wire/core/PWGIF.php on line 252 Warning: preg_match_all() expects at least 3 parameters, 2 given in /mnt/web216/a2/50/51925650/htdocs/processwire/wire/core/PWGIF.php on line 252 Warning: preg_match_all() expects at least 3 parameters, 2 given in /mnt/web216/a2/50/51925650/htdocs/processwire/site/assets/cache/FileCompiler/site/modules/ImageAnimatedGif/ImageAnimatedGif.module on line 285 Warning: preg_match_all() expects at least 3 parameters, 2 given in /mnt/web216/a2/50/51925650/htdocs/processwire/wire/core/PWGIF.php on line 252 [{"error":false,"message":"Added file: test.gif","file":"\/processwire\/site\/assets\/files\/1098\/test.gif","size":101734,"markup":"<li id='file_daf280af792fd5b906511363ae2bc39d' class='ImageOuter gridImage ui-widget'><div class='gridImage__tooltip'><table><tr><th>Dimensions<\/th><td>500x333<\/td><\/tr><tr><th>Filesize<\/th><td>99&nbsp;kB<\/td><\/tr><tr><th>Variations<\/th><td>0<\/td><\/tr><\/table><\/div>\n\t\t\t<div class='gridImage__overflow'>\n\t\t\t\t<img src=\"\/processwire\/site\/assets\/files\/1098\/test.0x260.gif?nc=1509109293\" alt=\"\" data-w=\"500\" data-h=\"333\" data-original=\"\/processwire\/site\/assets\/files\/1098\/test.gif?nc=1509109293\" \/>\n\t\t\t<\/div>\n\t\t\t\n\t\t\t\t<div class='gridImage__hover'>\n\t\t\t\t\t<div class='gridImage__inner'>\n\t\t\t\t\t\t<label for='' class='gridImage__trash'>\n\t\t\t\t\t\t\t<input class='gridImage__deletebox' type='checkbox' name='delete_thumbnail_daf280af792fd5b906511363ae2bc39d' value='1' title='Delete' \/>\n\t\t\t\t\t\t\t<span class='fa fa-trash-o'><\/span>\n\t\t\t\t\t\t<\/label>\n\t\t\t\t\t\t<a class='gridImage__edit'>\n\t\t\t\t\t\t\t<span>Edit<\/span>\n\t\t\t\t\t\t<\/a>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\n\t\t\t\t<div class='ImageData'>\n\t\t\t\t\t<h2 class='InputfieldImageEdit__name'><span contenteditable='true'>test<\/span>.gif<\/h2>\n\t\t\t\t\t<span class='InputfieldImageEdit__info'>99&nbsp;kB, 500&times;333 <\/span>\n\t\t\t\t\t<div class='InputfieldImageEdit__errors'><\/div>\n\t\t\t\t\t<div class='InputfieldImageEdit__buttons'><small><button type='button' data-href='\/processwire\/admin\/page\/image\/edit\/?id=1098&file=1098,test.gif&rte=0&field=thumbnail' class='InputfieldImageButtonCrop ui-button ui-corner-all ui-state-default pw-modal-large pw-modal' data-buttons='#non_rte_dialog_buttons button' data-autoclose='1' data-close='#non_rte_cancel'><span class='ui-button-text'><span class='fa fa-crop'><\/span> Crop<\/span><\/button><button type='button' data-href='\/processwire\/admin\/page\/image\/variations\/?id=1098&file=test.gif&modal=1&varcnt=varcnt_thumbnail_daf280af792fd5b906511363ae2bc39d' class='ui-button ui-corner-all ui-state-default pw-modal-large pw-modal' data-buttons='button'><span class='ui-button-text'><span class='fa fa-files-o'><\/span> Variations <span class='ui-priority-secondary'>(0)<\/span><\/span><\/button><\/small><\/div>\n\t\t\t\t\t<div class='InputfieldImageEdit__core'><div class='InputfieldFileDescription'><label for='description_thumbnail_daf280af792fd5b906511363ae2bc39d' class='detail'>Description<\/label><input type='text' name='description_thumbnail_daf280af792fd5b906511363ae2bc39d' id='description_thumbnail_daf280af792fd5b906511363ae2bc39d' value='' \/><\/div><\/div>\n\t\t\t\t\t<div class='InputfieldImageEdit__additional'><\/div>\n\t\t\t\t\t<input class='InputfieldFileSort' type='text' name='sort_thumbnail_daf280af792fd5b906511363ae2bc39d' value='1' \/>\n\t\t\t\t\t<input class='InputfieldFileReplace' type='hidden' name='replace_thumbnail_daf280af792fd5b906511363ae2bc39d' \/>\n\t\t\t\t\t<input class='InputfieldFileRename' type='hidden' name='rename_thumbnail_daf280af792fd5b906511363ae2bc39d' \/>\n\t\t\t\t<\/div>\n\t\t\t<\/li>","replace":true,"overwrite":0}]
  23. A simple recursive function that walks over all image fields and those inside repeaters(including FieldtypeFieldsetPage) to find images tagged with a certain tag(s). It can easily be extended to file fields by changing instanceof FieldtypeImage to FieldtypeFile, or be restricted to file fields by adding a !$type instanceof FieldtypeFile, too. Adapted from ProcessPageEditLink::getFilesPage() method. /** * Find all images tagged with a certain tag in a page including repeater items. * * @param $page Page to search tagged images * @param $tag string|array Image tag(s). Can be 'foo' for single, 'foo|bar' for multiple OR tags, 'foo,bar' or ['foo', 'bar'] for multiple AND tags * @return array Tagged images in [basename => Pageimage] associated array form or empty an array */ function findTaggedImages(Page $page, $tag) { $tagged = []; foreach ($page->template->fieldgroup as $f) { $type = $f->type; if ($type instanceof FieldtypeImage) { /** @var Pageimages $images */ $images = $page->{$f->name}; if (!$images) continue; $tagged = array_merge($tagged, $images->findTag($tag)->getArray()); } else if ($type instanceof FieldtypeRepeater) { $items = $page->{$f->name}; if (!$items) continue; if ($items instanceof PageArray) { foreach ($page->$f as $item) $tagged = array_merge($tagged, findTaggedImages($item, $tag)); } // FieldtypeFieldsetPage returns a single page instead of a PageArray elseif ($items instanceof Page) { $tagged = array_merge($tagged, findTaggedImages($items, $tag)); } } } return $tagged; } And can be used as $featuredImages = findTaggedImages($page, 'featured'); // get first featured image $featured = reset($featuredImages); // or array_shift($featuredImages)
  24. Hi all, PW: 3.0.42 I'm trying to have responsive images in the body field. First I need to stop the image tag generated by CKEditor adding the width attribute to the image tag on insertion. I found the 'Skip width attributes on image tags?' in the settings of ProcessPageEditImage and that suggests it does exactly what I'm after. Sadly, even when this checkbox is checked and a new image is inserted the width attribute is still added. Am I missing something? TIA.
  25. Hi, on a site I want to disable access to original images and only allow to access thumbnails and watermarked image variations. To create the watermarked images I use the PiM, what creates filenames with prefix "pim_". For individual thumbnails I use the Thumbnails-Module and define the prefix like "thumb_". A simple way would be to use a htaccess file in top of the assets folder with something like this for example: # deny access to all jpegs and pngs <FilesMatch "^.*\.(jpg|png)$"> Deny from all </FilesMatch> # allow access to pim_ - variations (my watermarked images) <FilesMatch "^pim_.*\.(jpg|png)$"> Allow from all </FilesMatch> # allow access to thumb_ - prefixed files (my individual thumbnails) <FilesMatch "^thumb_.*\.(jpg|png)$"> Allow from all </FilesMatch> # allow access to 100px thumbnails as used by default in PW-Admin when images-field is configured to display thumbnails <FilesMatch "^.*\.0x100\.(jpg|png)$"> Allow from all </FilesMatch> <FilesMatch "^.*\.100x0\.(jpg|png)$"> Allow from all </FilesMatch> The only downside is that I cannot access the original images from the admin backend. While it isn't an option to use a proxy-script from the front-end, it could be an option for the admin. Any ideas how I could access the originals when in admin backend?