Search the Community

Showing results for tags 'image'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • 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

Found 118 results

  1. Hello, I have repeater field with an image field as one of its fields. It works correctly on all but one templates. I added an image, it shows the image uploading, but then the image just disappears and it doesn't save. What could it be ? Thanks
  2. Hi, I have a big image in my image field and want to resize it to 2280px before showing it to the user. Most images are fine and showing as expected, but with one I have the following error; Error: Out of memory (allocated 159383552) (tried to allocate 12288 bytes) (line 243 of /htdocs/process/wire/core/ImageSizerEngineGD.php) Why is this with one image and not with the other ones, and how to solve this? Greetz.
  3. I have a problem realizing a picture gallery with albums using repeater fields. Here is what I have: - The repeater field 'repeater_gallery' for all the albums - A text field 'album_name' in the repeater for the album name - An image field 'album_images' in the repeater for all the album images Now I'd like to pick a small selection of images (say 4) of ALL albums randomly and present them with their associated album name. How can this be done with the described repeater setup? Or is there a better way to realize such a gallery without repeaters? Thanks in advance for a little help.
  4. Hi all, in the backend of ProcessWire it's possible to define a maximum width and height for images. If you upload an image, it will be resized automatically. I find this feature very handy to safe space. Very often users upload images which are much bigger than needed. On my application users can upload their images via the frontend. But if you upload images using the API, images won't be resized automatically. Is there any way to do this? Currently that's my code: if ($_FILES['thumbnail']['name']) { $upload = new WireUpload('thumbnail'); $upload->setMaxFiles(1); $upload->setOverwrite(true); $upload->setDestinationPath($lesson->video_image->path()); $upload->setValidExtensions(array('jpg', 'jpeg', 'png')); $lesson->video_image->removeAll(); foreach ($upload->execute() as $file) $lesson->video_image->add($file); } Thanks very much! Dennis
  5. Hello everyone, I've been fiddling around a lot lately with docker containers for my local development on a linux machine. Tried many different options, also readily available processwire images and tutorials from the forum. But never got it right. Mainly because of permission issues with docker volumes. That is a tricky part on linux machines whereas on OSX it doesn't seem to be an issue. Then I discovered And the setup with nginx as a proxy that routes requests to separate containers with the actual site install appealed to me. The whole thing sits on top of alpine linux containers which are really lightweight. So I decided to give it a try. And, first time since experimenting with docker, I got a running PW install. Rewriting was not working until I adjusted the nginx config. Now I have a fairly complex PW site running in a container. Everything is working, image upload/editing etc. So I'm really exited, especially since the dev site is now blazing fast compared to my old vagrant virtualbox vm setup. Honestly, I don't really understand everything that is happening behind the scene. But I managed to adjust the original files and build a new image that works with PW and doesn't have all the WP stuff. The nginx config I took from Not sure if it covers everything for PW3 as well. I would very much appreciate if someone who is more in the know than me could take a look. All files for building the docker image are here A working image here: Documentation is kind of lacking. I took over quite a lot from the original project. But following the github README and the original documentation should get people started who have a little experience with docker already. If someone needs a more in depth step by step tutorial for setting things up, let me know and I'll put something together.
  6. Hi PW Community, I have a problem where a page is loading up fine on my local dev machine + 1 of the test sites, but not on another test site. They have identical PW (2.8.35?) and codebase installed. The 2 sites are hosted on the same hosting provider, as well as our other sites. 1) Error Logs. There is nothing particularly strange logged on the PW Error log for all the sites. I am getting a "You must assign a template to the page before setting custom field values (title__data) [pageClass=Page, template=] (WireLog)" error, but I'm getting this error on working pages as well. However, there are some errors in our Hosting Provider's log. The error seems to point at some sort of permissioning issue regarding reading the image files? 1.a) File / Dir permissions of Images - I've checked file permissions on the normal and problematic sites. They are all identical 2) .htaccess - I've tried running the .htaccess file from the working site on the problematic site - No Luck 3) codebase - I've done 3 comparisons. They are identical on all sites. 4) wire directory - See above 5) Behaviour - So the problematic site loads up most of its page as expected without problems. It's just a couple that it has issues with. Problematic URL Example : Working URL : I've also attached the KIS Error Logs. Has anyone come across behaviour like this before and what would be the way forward to fix this? KIS.Error.Logs
  7. We had an outside vendor help develop our website. The vendor has closed their business. I'm trying to modify 1 of the images near the bottom of our website but can't figure out how. We're new to processwire. I see how I can modify the individual pages but can't seem to figure out where to go to change this image n near the bottom I attached the image that I need to change. Thanks in advance for any of your help!
  8. I am currently working on a website in process wire. I created an image field and added svg as a valid file extension and could upload a png image and a jpg image but when I try to upload a svg image it is stuck loading at 100%. I figured out that the image field does not take the extension svg even if I add it as an extension. and I was wondering if their is any way to upload a svg image to an image field in processwire? I am working with processwire version 3.0.61
  9. First up, a massive thanks to Ryan, the developers and community on this great CMS. We have spent the last 4 weeks looking at the best option for a client and it looks like ProcessWire will be the choice. We ignored the top 3 (Drupal, Joomla, WordPress) but spent a lot of time with Grav, Hugo, Concrete5, October and PimCore before we arrived here. I am not saying some of these are not great as well, but sometimes the best CMS is the one that matches your needs the most. I can't tell you how much of a pleasure it was to find your CMS and community So, one of the things we have seen that our client likes a lot is how many other systems handle Image and Asset Library. They like to be able to upload many 1000's of images, PDF's that get used on many different Pages. Content Editors can quickly find images from a tree/directory/tag structure and Drag and Drop over onto their pages. My question is anything like this on the roadmap ? If not, then does anyone in the community have a pointers or ideas on best practise to implement this ( a module? ) or is it something ( a use case ) that does not sit well with the way Processwire wants to be architected? Again, fantastic work folks, we are really enjoying Processwire and looking forward to looking at the ProDrafts & ProForms modules as well in a few weeks.
  10. I have been scratching my head on this one for a while, so I thought maybe someone could shed some light on this issue. I am using a grid layout (that I have created over the years) with a class for responsive images (very similar to bootstrap, but very stripped down). Using this, I created a gallery using a foreach loop, and included a "print button" to print each image. I got the classes and everything worked out, but I ran into a small problem with the print functionality. My images (which are around 2400px wide to fill the space) are just fine in the grid and on resize, but when I print, they "run off" the page. I understand that they are just too big to be printed in portrait mode, which led to me think that I could use $image->size(); to print a scaled down version of the image (which adds a bit more load time as now the site needs to load the image large scale and the scaled down version). However, I can't seem to wrap my head around serving just the scaled down version for print only (obviously display:none; doesn't do the trick). Has anyone tackled this before, or does anyone know of a more elegant solution to the conundrum that I have found myself in? The Foreachloop: $printclass = 1; foreach($page->galleries as $gallery) { $printclass++; $printimage = $gallery->gallery_image->width(600)->url; $out = ""; $out .= "<div class=\"row\">"; $out .= "<div class=\"grid-12\">"; $out .= "<img src=\"{$gallery->gallery_image->url}\" class=\"reimage\"/>"; $out .= "</div>"; $out .= "</div>"; $out .= "<div class=\"row\">"; $out .= "<div class=\"grid-12\">"; $out .= "<a href=\"#\" onClick=\"printCoupon('printable{$printclass}');\">Print</a>"; $out .= "</div> "; $out .= "</div> "; $out .="<div id=\"printable{$printclass}\"><img src=\"{$printimage}\"/></div>"; echo $out; }
  11. Hi, here is a very useful tool that check your images in websites against responsiveness:
  12. Hey Everyone, I have a question that seems like it would have an obvious answer, but I cannot wrap my mind around it: If I have <img src="<?= $page->featuredImage->size(800,500)->url ?>"/> in an article template, does my server run a resizing script every time someone requests the page? Or, is it resized only the first time it is requested? Or when the page is saved? The reason I would like to know is because I have created two image processing functions my client requires, but one of them is a paid subscription service to compress the images. I don't want to call the paid API every time a page is loaded or something. Thanks for fielding my ignorance
  13. Hi all, I've not been able to upload SVGs into a regular image field, with SVG added in the Valid File Extensions field. The error I'm getting is: Error: Call to undefined function ProcessWire\simplexml_load_string() (line 234 of /var/www/hosts/our_website/Develop/Source/wire/core/Pageimage.php) I tried the ImageRasterizer module, but that didn't fix it. Is there a workaround for folks that don't have the simplexml module installed?
  14. Had a couple of older PW 2.7 sites slow to the point of failure this week. A bit of digging revealed that the external image compression service used by ProcessImageMinimize is no longer available. Development on the module ceased some time ago. Quick fix was to uninstall the module and edit the output code to use native PW image options. All affected sites operational again. Next step is to update them to PW3.0+ ...
  15. Hey all, I am trying to prevent the display of descriptions for images in default language while user browses site with alternative language. In a gallery my goal would be to display the same images, and hide the description that I am using as captions. As a hack I could decide based on tags, but this causes extra workload for the editors of the site, and seems less robust than a built in query. Any hints are highly appreciated.
  16. Hi there, i run in an strange behavior when using the PageTable field. I have a PageTable field named upload - the template for this field has following fields: file (file field) nums (table field) color (colorPicker field) Now i try to get the url's for the uploaded files (in this case 1 PDF and 1 SWF) $uploads = $page->upload; foreach ($uploads as $upload) { $file = $upload->file; echo $file->url."<br>"; echo $file->filename."<br>"; } Which returns: Upload 1 /DB-v2/site/assets/files/1060/ Upload 2 /DB-v2/site/assets/files/1061/ So you can see the URL only returns the path to the folder? And the filename isnt reachable. Anybody have a idea ? Thanks in advance and bye bye Simon
  17. Hello there. I was wondering if there is a more elegant way inlining an SVG that was uploaded in the backend by an image field? // /processwire/site/assets/files/1101/monitor.svg <- this is what I get // ../assets/files/1101/monitor.svg <- this is what I need $iconURL = $page->icon->url; $findThis = '/assets/'; $iconURL_arr = explode($findThis, $iconURL); $iconURL = "..".$findThis.$iconURL_arr[1]; echo "<span class='icon'>".file_get_contents($iconURL)."</span> ... and before somebody is asking: - yes, I want it inline. - and no, I do not want to use an icon font.
  18. Hey All. I tried google but couldn't find anything appropriate. My question is, if there is a module out there that I missed, to get images from Image- or CroppableImage-fields in a very blurred or distorted filtered version? Thanks a lot!
  19. Hi all, Currently I'm developing a new feature for my module ImportPagesPrestashop. This module imports your categories, products and more from a prestashop database and implement that data in ProcessWire pages. I've made the following structure for this: Products (Parent Page which the user has to choose) Categories (implemented from the database) Products (Implemented from the database) And inside of the product pages several fields for the specifications of the products, description, images and more. So I've build a check inside of my module which doesn't allow you to first import the images and then the products or in another way, but you have to follow this route: Categories Products Specifications Images This is because the products require a category as their parent page and the specifications and images need a product page. Now I want to remove the check if you used this module before, so all pages you need are already there, you only need to update the pages. That's why I have done the following: $parent = $this->parent; if (!$parent->hasChildren()) { //if parent has no children, module isn't used before // set ranking in import // my code } if ($parent->hasChildren()){ //module is used before, so parent has children //no ranking in import, any button can be clicked. No specific path required. //my code } So far so good. It works and I was happy with it, until I tried to import the images of the products. I encountered a error which says this: Error: Call to a member function add() on a non-object (line 986 of / etc etc) So I was like huh, why doesn't this work. I will explain how I perform the import of the images. If the button is clicked, another function is called: if ($this->input->post->importimg) { return $this->processForm51($form); } so function ProcessForm 51 is called, below you can see this function: protected function processForm51(inputfieldForm $form){ ///... some code $this->ImportImages(); //Function is called which performs the import of the images return $this->processFormMarkupImg($imgImported); //return after the import } This function links to the function that performs the import: protected function importImages(){ // some code to get the images and store it in $pictures $pagesWithImages = wire("pages")->find("images_product.count>0"); //find pages with that field for the images foreach ($pagesWithImages as $product_page) { $product_page->images_product->removeAll(); // remove existing images $product_page->save(); } foreach ($pictures as $picture) { $id_product = $picture['id_product']; $product_pages = wire("pages")->get("productid=$id_product"); //get the correct page so the images are placed in the correct product page // ensure output formatting is off $product_pages->of(false); $str_prlink = $picture['product_name']; //make sure end of string ends with alphanumeric $image_name = preg_replace('/[^a-z0-9]+\Z/i', '', $str_prlink); $image_url = $picture['file_id'] . "/" . $image_name . '.jpg'; $image_path = "" . $image_url; try { $imgfield = $product_pages->images_product; $imgfield->add($image_path); //add the images to the field } catch (Exception $e) { } $product_pages->save(); } } This should work because when I perfom this import WITH the ranking in import (first categories, 2nd products etc) it works! I don't get it why this gives an error WITHOUT the ranking in import. So that's why I am asking it over here, hopefully anyone knows how to solve this. Thanks in advance, ~Harmen
  20. Hi, I can't seem to be able to crop an image in the backend. I'm using PW 3.0.29 in Chrome without Image plugins. When I click apply, the button stays on "Saving..." forever. I get the following JavaScript Errors: An invalid form control with name='width' is not focusable. ?id=1024&file=1024,cfaf-2013-poster.jpg&rte=0&field=poster&modal=1:1 An invalid form control with name='height' is not focusable. ?id=1024&file=1024,cfaf-2013-poster.jpg&rte=0&field=poster&modal=1:1 Is this a bug?
  21. Hi guys, I created a custom ProcessModule to manage children of an admin page. The children are always in hidden state and have a template assigned. I can render the page edit form by template and use ajax upload for images. After submitting the form I can see that all images are stored in the assets folder but they aren't saved in the database. All the other inputfields (text, textarea, checkbox...) were saved correctly. Could you please help me? Here is the code is use for the form: public function ___executeEdit() { $page = $this->pages->get($this->input->get->id); if($this->config->ajax && (isset($_SERVER['HTTP_X_FIELDNAME']) || count($_POST))) { $this->ajaxSave($page); return ''; } $this->headline(__('Edit')); $this->breadcrumb('../', $this->page->title); $form = $this->modules->get("InputfieldForm"); $form->attr('id', 'PageIDIndicator'); $form->attr('action', './?id='.$page->id); $form->attr('method', 'post'); $form->attr('enctype', 'multipart/form-data'); $form->attr('autocomplete', 'off'); $form->attr('data-uploading', $this->_('Are you sure? An upload is currently in progress and it may be lost if you proceed.')); // fields $inputfields = $page->getInputfields(); $form->append($inputfields); // save $field = $this->modules->get("InputfieldButton"); $field->type = 'submit'; $field->name = 'submit_save'; $field->value = $this->_("Save"); $form->add($field); // delete $field = $this->modules->get("InputfieldButton"); $field->type = 'submit'; $field->name = 'submit_delete'; $field->value = $this->_("Delete"); $form->add($field); if($this->input->post->submit_save) { $form->processInput($this->input->post); $errors = $form->getErrors(); if(count($errors)) { // show errors return $form->render(); } else { // save values foreach($page->fields as $field) { $fieldName = $field->name; $page->$fieldName = $this->input->post->$fieldName; } $page->save(); $this->session->redirect($this->page->url); } } else if($this->input->post->submit_delete) { $page->delete(); $this->session->redirect($this->page->url); return true; } else { return $form->render(); } }
  22. I'm currently developing a site where some image fields need to be able to have two images associated with them, a thumbnail and a full sized image (which is often a different crop) which will be shown in a lightbox view. This is fine for most templates, I'm just using normal image fields that return an array and support up to two images. If a second image is present in the field then it will be used as the alternative image for the lightbox. If only one image is present, it will be used for both thumbnail and full sized (the template resizes for the thumbnail using the API). However I have templates with flexible layouts using a repeater matrix, and one of the matrix types is an 'image grid'. This is an image field that supports an unlimited number of images, so obviously this method is not suitable here. I've tried creating a repeater in this matrix type which contains an image field (each supporting two images, as above), but this means that I can no longer drag and drop multiple images at once. Each image in the grid has to be uploaded individually which is a big problem as there are many instances of these grids with a large number of images. I've tried the ImageExtra module but it seems you can't add an image field as a secondary field. Any suggestions as to how I might solve this problem?
  23. Hi, I have been trying to display an image in my search results, but only get the broken image. the code is foreach($matches as $match) { echo "<img src='$match->$pic->url'>"; echo "<a href='$match->url'>$match->title</a>"; echo "<div class='summary'>$match->summary</div></li>"; } echo "</ul>"; What am I missing here? Cheers
  24. Hi. I've been trying to tackle this problem all day. I have my image upload script working well. On computers, I can upload just fine and have the images resized. But when I try to upload from my phone using the camera, I see the file get uploaded to the server, but then when it comes to the resizing portion, it completely fails. No errors to trace. At first I thought it was iPhone related, but reproduced it on my Android phone. It seems to happen with camera taken images (even DSLR). I can create a photoshop image that is a larger image size, and that works. I'm able to call the image itself it and it displays the original image data, the original file is on the server, the code is pretty basic. I first try getting the URL of the first (and only) image: Start $user->avatar->first->url End Result: Start /site/assets/files/1525/profile.jpeg End BUT when I do this: Start $user->avatar->first->size(100,100)->url End I send up with: Start It simply dies with no error to trace back. Even when I have debug turned on, nothing. For the life of me, I can't seem to pinpoint the issue. Has anyone else come across this?
  25. Hi community, i'am not a pro in module creation and i need someone, who build it better. What my stuff at this time does: there is a page "Standard". This Page can upload into OR select Images from "Image Library". The pages inside "Image Library" are simple pages with a imageField (single) inside. The page "Standard" looks like this: "Select existing Images" ist a pageField. The Inputfield is a AutocompleteField with preview oh the selected pages (from "Image Library"). "Image (add if not exists)" is a imageField (multiple) this two fields togehter and some hooks are the core of my project. select a image form the list, or upload a new one. The Module has to parts: The new Autocomplete Inputfield for FieldtypePage and a processing for the imagefield via hooks. Lets start with the ImageField: Upload a Image(s) like everytime in Processwire. After hit "Save": a "Page:saved" hook is checking if the image is already in the Library is checking the basename. if basename already exists, the code compares the two images by pixelanalysis(!) if in Library already: then add the existing Page with this image to the PageField field if not: create a new page with template "Image", add the image there, and add the new page to PageField after all: remove the image from this page (because we linked the image via a page) The pageField is a clone of the existing InputfieldPageAutocomplete, but i extended that with little new function: display images in ___rendeListItem() and the javascript-version after AJAX loading. In my module, you can use as a new label specific string img:{a_image_field.url}:img. This pageField automatically controls the imageField. The selected Parent and Template is the path for new Pages and there Templates. I'am testing a lot with this new components. Works fine. I Like this solution for pages where many images are allways the same (like a product-catalog). Download the zip and have a look. Installation Follow this steps: Install module "InputfieldPageAutocomplete2" install module "ImageUploadOrSelect" create a Template "Image" now we need a unique name for three fields. For example: "loremipsum". create a field of type image, call it "imageuploadorselect_imagetarget_loremipsum". this field is single image field. no array output! add the field "imageuploadorselect_imagetarget_loremipsum" to template "Image". create a field of type image, call it "imageuploadorselect_imagestemporary_loremipsum". this field is multiple. array output! add this field to a template you decide. For example "basic-page". create a new field of type Page, call it "imageuploadorselect_pages_loremipsum". set up this field like in the image above. Parent: a page you decide (where pages with template "Image" will be created) Template: Image Labelfield: custom Custom page label format: {title} img:{imageuploadorselect_imagetarget_loremipsum.url}:img Inputfieldtype: "PageAutocomplete2". add this field to template from step 8, where the imageField also is. I would be very happy if someone could help. How i sad before, i'am not the pro. I looking for somebody who could help me to merge this stuff in one module to share it in the community. I commented all the things in the files. There are a lot of detailed information. Have nice weekend!