Wordpress nextgen gallery embedded images. Gallery for wordpress plugin nextgen gallery. Paid versions of NextGen

Good day!
In today’s post, we’ll look at the question of how to implement an image gallery on a website (blog) using the nextgen gallery plugin and, of course, we’ll understand all the intricacies of its settings - placing an image gallery in articles, pages, categories, installing a watermark on images and many others parameters.
So below you can see how the image gallery will be displayed on your website.

Click to enlarge

Setting up the nextgen gallery plugin

I skipped the installation and activation of the plugin, I think this is not the first time you’ve installed WP plugins, but if you’ve forgotten, then let’s remember.

After installation in admin. In the WP panel, a new “Gallery” item will appear with 7 items, numbered in the screenshot below.

1. We skip the statistical data there on how many galleries and albums have been created.

2. “Add gallery/Images”

Click to enlarge

  • 1 – create a new gallery – this item will be installed by default.
  • 2 – indicate your gallery name – for example: Corsets2.
  • 3 – go to Add Files – a window will open, select your
    pre-prepared images, pictures.
  • 4 – open.
  • 5 – list of downloaded images.
  • 6 – Start Upload – uploading images to the created gallery.

3. Manage galleries – this item will display the created galleries and their information (id, title, number of images, ).
Also at this point a watermark of a particular gallery is set.

Click to enlarge

  • 1 – select an action.
  • 2 — mark id.
  • 3 – choose to put a nextgen gallery watermark.
  • 4- apply.

4. Manage Albums - After creating and selecting an album below, you can drag a gallery or another album into your new album.

5. Tags – edit, change or set new tags for images.

6. Gallery setup – here you set the basic requirements for your image gallery when setting up the nextgen gallery plugin – this section can be considered one of the main ones, so what will happen here
7 points

Click to enlarge

p. 1 NextGEN Basic Thumbnails - basic thumbnails

Click to enlarge

  • here the main attention should be paid to point 2 - here we set the size of the gallery images, point 3 how much to display on the page and hardly.
    For example: let’s set 3 images per page and get 3 in a row
  • Click to enlarge

    p. 2 NextGEN Basic Slideshow - slideshow
    Here you can set the maximum image size (the parameters 600 by 400 are quite normal), but you can experiment.
    p. 3 NextGEN Basic imageBrowser - images in the browser.
    You can also leave it as default (Switching pages via AJAX)
    p. 4 NextGEN Basic Single Pic - single
    here we mark point 1, point 2 and point 3 are marked in the screenshot

    Click to enlarge


    pay attention to step 2 show the watermark (which is connected to the gallery in Gallery management).
    p. 5 NextGEN Basic TagCloud - tag cloud.
    the maximum number of tags is 45 by default; you don’t have to change anything.
    p. 6 NextGEN Basic Compact Album - compact album.
    p. 7 NextGEN Basic Extended Album - extended album.
    You can leave it by default, from the name itself it should already be clear to you that they are intended for albums, if you create albums then you can customize them by indicating how many galleries to display in the album, etc.

    7. Other settings - here you set the basic settings for the entire plugin in this item, 8 sub-items.

    Click to enlarge

    Here I would like to draw the main attention to the point 3 Lightbox effects and 4 Watermark.
    3 - Lightbox effects there are two points here.
    Point 1. Selecting an effect - there are 5 of them, when you set one or another effect, the images will be switched for viewing in different ways. An example of three is shown in the screenshot

    Click to enlarge

    Test and select your image switching effect.

    Point 2. Allows you to select the scope of application - you can select for all the images that you have on the site or just for this plugin.

    4. watermark - here we set up our own, you can use an inscription or a picture.

    How to place an image gallery on a page

    To do this, you need to place a shortcode on the page where you are going to display the gallery
    gallery thumbnail

    I am often asked to help install and configure this or that functionality for WordPress sites. Most often, I don’t refuse, I do it, and then I write detailed or not very detailed Instructions for setting up and using this or that plugin. A few days ago, a reader contacted me with a request to quickly install and set up a Photo Gallery on his website. Based on my wishes, I realized that the NextGen Gallery plugin is best suited to solve this problem.

    I once already posted an article on setting up this plugin. Then there was the previous version. In order not to make a mistake, I decided to write the Instructions again. I sent it - the person was satisfied.

    It does not fully describe each and every setting of this wonderful plugin. In it, I outlined the main points that allow you to quickly configure the main functions of the plugin - display photos in the form of a Gallery, not a Slideshow, and add a short description for each photo.

    My plugin is not Russified. Perhaps someone has a localization for the latest version of the plugin - please share it, I’ll post it for everyone.

    I do not edit the text of the Instructions, it is the same as what I sent to the customer, so it contains such a narrative. All instructions are accompanied by screenshots for easy study of the settings.

    So, here I go.

    Setting up and using the pluginNextGenGallery

    I installed the latest working version plugin, it is not localized into Russian, but I will try to write the main thing and show it in pictures - how to create a Gallery and how to display it inside a post.

    You asked to make it so that you would display three pictures in one row. I did.

    A little about the settings:

    The plugin has its own settings tab in the Management Console. Located at the very bottom left:

    I have highlighted with red a line the main plugin settings pages for you that you will use.

    On the Option page you will see several Tabs:

    Go to the tab Images:

    I have highlighted in red an important element of the Image output settings - its size in pixels - width and height.

    This is the size of the popup window.

    TIP: Make all pictures the same size, for example 800 by 600 pixels, or another correct size (correct = 2 to 1 or 4 to 3 ratio).

    If your big pictures are different sizes, then in a window measuring 800 by 600 they will lose image quality, if the pictures are small they will be “smeared out”, etc.

    If you plan to display large images in a different size, then replace the selected size 800 by 600 with another size, for example:

    How to add a new gallery

    Go to page Add / GalleryImage. Open the tab - AddNew Gallery

    First you need to come up with a Name for the Image Gallery and write it down in this window.

    TIP: do not use Russian letters. It’s better to write in transliteration so that you can understand what this gallery is about.

    For example: you want to add nature pictures and mountain views to the galleries. Then write the name of the category like this: Priroda_Gory. Do not use spaces (not recommended). You can use numbers without spaces.

    IMPORTANT! Do not add image files with Russian names in their names!

    Files are in English only.

    TIP: you don’t need to come up with file names in the form of numbers. It is advisable (for better indexing by search engines, give the file an English term). If the picture shows mascara, name the file: mascara.jpg.

    File format is standard: JPG, GIF, PNG.

    If the files are dedicated to a certain category, a general topic, also name (approximately) the Gallery. For example: Mascara

    Then click the button – Add gallery.

    The gallery will be created and you will see its short ID in the form of a number.

    Do you see? The number of the created Gallery appears at the top – id=4. You can remember the number, it will be useful to you.

    Now you need to add image files to this Gallery.

    You are in the first tab of the page. First, select Choose gallery from the drop-down list. Find the created Gallery and place it in this window.

    Then Click the button – Browse… A window will open and select the prepared image files on your computer.

    TIP: Prepare pictures for the Gallery in advance, with established sizes. Create a Folder and name it Galleries. Inside are folders with Galleries named Galleries (same as here). It will be easier for you to search and navigate in the future.

    Let me remind you that in the Post, thumbnails are displayed 3 pieces in a row. This means that your Gallery should have a number of photos that is shorter than three, for example: 3, 6, 9, etc.

    You can add pictures all at once. To do this, press the Ctrl button on the keyboard and use the mouse to mark all the photos to be added.

    I will now do this as an example to show:

    Now, after selecting the pictures, press the button – Open.

    Do you see a list of three files? Now click the button – Upload images.

    Wait until the plugin adds all the pictures to the Gallery.

    If everything went well, this message will appear - 3 picture(s) successfully added

    This means that the Gallery has been created and added to your collection.

    If something goes wrong, there will be an error and the Gallery will not exist. Try again.

    How to add pictures to a Post

    Once you have created a Gallery, you can add it to your post. We switch to the post editing mode (or create a new one), go to the editor. In the editor panel you have new button– to add Galleries:

    Place the cursor on a new line.

    Click the button. A pop-up window will open:

    Click on selection:

    Select the Gallery named Mascara. Click the button – Insert.

    A short code will appear in your post:

    Knowing the Gallery ID (remember, I advised you to remember), you can simply add a Gallery using this code, only change the ID of the selected Gallery.

    Now Save the entry and check in the mode – View changes.

    In this draft post you now have two Galleries created by me:

    How to create a short description for a picture

    When opening big pictures the visitor sees the following:

    When you move the cursor around the picture - right and left - a visitor navigation arrow appears in the middle.

    Below are the words Image 4 of 6. That is, it is possible to navigate through all the Galleries added to one entry. But there is no accompanying short description to each picture. Let's do it together.

    Open the Manage Gallery page (in the plugin management console). You will see a list of your Galleries.

    Here you can delete and edit them.

    Select a Gallery and click on its name - the Gallery editing page will open:

    You should be interested in the Alt & Text / Description section in the description of one picture. Do you see the word in the first picture – snow? This is the Alt tag of the image. And a little lower - empty window for the description of the picture. Let's write a few words, for example:

    Snow-covered estate of Count Volkonsky near Moscow

    Open the entry. Click to view the picture. Look below the photo:

    I told you the main functions for working with this plugin.

    If you carefully look at all the settings, and there are at least 80 of them, you will understand that the plugin has a lot of interesting functionality.

    One short Instruction cannot describe them all. I advise you to look for a more complete description of the plugin’s capabilities on the Internet. A lot has been written about this plugin; it is one of the most popular image display plugins for WordPress sites.

    I recommend searching for information on it using the following queries:

    WordPress plugin NextGen Gallery settings

    In second place is my website - a catalog of templates. I already wrote about this plugin, only about previous version, it's a little different, but not much. This one has more functionality, but the main one is the same.

    If you have any more questions, write.

    Description

    NextGEN Gallery– a plugin that offers flexible system creating, managing and displaying a gallery.

    Full name in search: NextGEN Gallery

    Installation:

    Automatic:

    1. Go to the admin panel and select Plugins -> Add new.
    2. In the search, type “NextGEN Gallery”.
    3. Click the Install button.
    4. Click the Activate button.

    Manual:

    1. Go to http://wordpress.org/plugins/nextgen-gallery/
    2. Download latest version"NextGEN Gallery".
    3. Unzip the file into your WordPress plugins folder.
    4. Activate the plugin on the site.

    Working with the plugin

    Since the plugin provides enormous opportunities for creating a gallery and a small book could be written to describe the entire plugin, we will only consider creating a simple gallery. Understanding the remaining functions will not be difficult if you have minimal knowledge of the English language.

    After installing the plugin, the Gallery item appears in the admin panel (Fig. 1).

    The plugin has 8 sections (Fig. 2).

    All these sections provide flexible options on setting up your gallery, but we will not consider them by default, but will move directly to creating a simple gallery.

    We will create a gallery on a new page; creating a gallery in a post is similar. So, select “Add new page", enter the page name "Gallery Page" and select "Attach gallery" on the toolbar (Fig. 3).

    In the window that opens, select “Add Gallery/Images” to create a new gallery and add images to it. Next, write the name of the gallery, select images to upload by clicking “Add Files” and upload them by clicking “Start Upload” (Fig. 4).

    We select the gallery itself to display (Fig. 6).

    We sort the pictures to display on the page and complete the creation of the gallery by clicking the “Save” button (Fig. 7).

    Note: The gallery name must be in Latin, otherwise the plugin will not find the path to the images.

    Today we will look at a super popular plugin for creating a photo gallery on your WordPress site. The plugin has many functions with which you can customize the gallery the way you want. You can create slideshows, open images in a lightbox window, add animation effects to images, change the number and size of images, use the Ajax function to switch pages, add watermarks to images, insert links and much more. You can create many galleries and add them to posts or pages very easily.

    You will have several gallery display options to choose from:

    NextGEN Basic Thumbnails, standard gallery.

    NextGEN Basic Slideshow, slideshow.

    NextGEN Basic ImageBrowser, browser gallery.

    NextGEN Basic TagCloud, gallery in the form of a tag cloud.

    NextGEN Basic Compact Album, compact gallery.

    — gallery in the form of an album.

    You can install the plugin on your website directly from the WordPress admin panel. Go to the page: Plugins - Add New, enter the name of the plugin in the search form, press Enter, install and activate the plugin.

    After installing and activating the plugin, go to the page: Gallery - Gallery settings. Here you can configure basic settings for all galleries.

    NextGEN Basic Thumbnails, here you can specify how many images will be displayed on one page. You can specify how many images there will be in one row. You can choose a gallery template. You can enable the page switching feature via AJAX. The remaining settings can be left unchanged. Hover your mouse over the parameter symbols and you will be shown a window with explanations.

    NextGEN Basic Slideshow, here you can set the maximum image sizes, select an effect for the images (experiment with the effects), you can set the interval between images, you can enable or disable the display of thumbnail links.

    NextGEN Basic ImageBrowser, you can enable the function of switching pages via AJAX, you can select a template for this gallery.

    NextGEN Basic SinglePic, Here you can set options for displaying a single image.

    NextGEN Basic TagCloud, specify the maximum display of tags in the gallery, select a template.

    NextGEN Basic Compact Album, here you can choose how galleries will be displayed in the album, you can specify how many images will be on one page. You can enable breadcrumbs, everything else can be left unchanged.

    NextGEN Basic Extended Album, the same settings as the previous album, only this is a more expanded album.

    Image settings, Here you can leave everything as it is; if you wish, you can reconfigure the parameters to suit you.

    Thumbnail options You can set maximum sizes for image thumbnails.

    Lightbox effects, here you can select an effect for opening images in a lightbox window. You can experiment with the effects.

    Watermark, You can add a watermark to your images. You can choose which part of the image the watermark will appear in. You will need to provide the URL of the watermark image.

    Styles, You don’t have to change anything here, leave everything as it is.

    Distribution of privileges, here you can specify who has access to the Nextgen Gallery plugin parameters.

    Other settings here you can add an RSS link to the gallery, you can clear the image cache, etc.

    Reset settings here you can reset the settings to the default value, that is, to the original values.

    Save your changes.

    On the Tags page you can :

    Rename existing tags.

    Delete existing tags.

    On the page - Manage Albums, you can create albums and add galleries to them.

    To create an album, specify the name of the album and click on the button - Add. After creating an album, you can edit the album, specify a description of the album, select a thumbnail for the album, and you can select a page for the album.

    Creating a new gallery

    To create a new gallery, go to the page: Add Gallery/Images.

    1 — specify the name of the new gallery.

    2 — Click the Add files button to upload images from your computer.

    3 — Click on the Start Upload button to upload the images to the gallery.

    After which you will have a new gallery created. Here you can import a ready-made folder with images into your gallery. Select a folder and click on the button - import/gallery. Please note that if you check the box to leave images in the original folder, then when you delete the gallery, all images will be deleted from the original folder.

    On the gallery page you can change the main parameters of the gallery - title, description, gallery location, page link, cover image. You can exclude any image from the gallery.

    Adding via post or page

    Open for editing or create a new page or post. IN visual editor WordPress you will have a new green button to add a gallery. Click on this button.

    Next, in the window that opens, select the option to display the gallery. On the tab - What do you want to display, click on the Galleries field and select the gallery that will be displayed on this page. Click on the button - Save.

    Publish or update the page, go to the site. The site will display the finished photo gallery.

    If you click on an image, it will open in a lightbox window and all images in the gallery can be viewed in the lightbox window using the right and left arrows.

    ). Nextgen gallery is powerful and quite flexible tools to display different forms of images on the site, be it a gallery, a slider or a separate image. Managing the plugin is intuitive and usually does not cause difficulties (especially considering the huge number of manuals and thematic materials on the Internet).

    Organizing Images with Nextgen Gallery Album

    We will create an nggalbum album (in our case, the album is needed to display images from the “bathroom curtains” gallery) in two stages:

    1. Preparing images.
    2. Preparing pages to display our gallery.

    Preparing images for album organization using nextgen gallery album:

    • create a gallery ( remember our gallery ID - 3);
    • add the necessary images to the gallery ( do not use Cyrillic names and avoid spaces in image names).

    Preparing pages to display nextgen gallery album:

    • Let's create a new page called "Curtains for the bathroom", in which we will display the newly created gallery using the shortcode ( do not use quotes or extra spaces).

    Let's move on to editing albums in nextgengelery.

    1. Let’s create a new album: to do this, just write its name in the appropriate field and click “Create” ( remember our album ID - 5).

    2. Edit the description of the newly created album.

    Now that our album is created, let's create a page to display album categories (in our case, this is the "Gallery" page): to do this, add the following shortcode to the page, where ID is the album ID, and template=compact is a short template (only the image and title) of the album display (template=caption - image and brief description, template=extend - image, title and full description album).

    As a result, we get this nice gallery consisting of five albums:

    In order to change the order in which albums are displayed, in the nggalbum settings, drag the albums from the right block to the left, sort them in the required order and click the "Update" button.

    Nextgen gallery displays shortcode

    If you see a shortcode on the page instead of gallery images (and you are sure that the plugin is installed correctly and active), try the following:

    • check the shortcode for extra spaces;
    • try removing all extra quotes;
    • make sure that the shortcode contains the correct ID (you can check it on the gallery settings page);
    • check the correctness of the shortcode syntax (a list of shortcodes can be found on the official nextgen gallery website);
    • make sure that there are no Cyrillic characters or spaces in the image names;
    • check folder permissions inside the plugin directory.