Tips will be added here as they are provided to our users.

How to Check for Javascript Errors

Using Google Chrome, right click anywhere on the page and select 'Inspect Element'
Click the console tab and look for any error messages. Debug accordingly.


Improve your File Security**

If you're running AMG v1.1 - please download and add this htaccess file to your /admin directory -> Download Zip File.

If you're running nginx - add this code to your config file:

rewrite ^/config.ini.php$ / permanent;


Script to Configure Nginx Servers (To replace htaccess)

Nginx configuration (Experimental)

Add to the virtual host config file for the website. e.g. etc/nginx/sites-available/yoursite

# start nginx configuration
rewrite ^/trans.gif /includes/beacon.php;
rewrite ^/image/([a-zA-Z0-9-]+) /image.php?slug=$1 last;
rewrite ^/video/([a-zA-Z0-9-]+) /image.php?slug=$1 last;
rewrite ^/order-by/(.*)$ /index.php?order-by=$1;
rewrite ^/search/(.*)$ /index.php?s=$1;
rewrite ^/gallery/([^/]+)$ /index.php?gallery=$1;
rewrite ^/gallery/([^/]+)/order-by/(.*)$ /index.php?gallery=$1&order-by=$2;
rewrite ^/tag/(.*)$ /index.php?tag=$1;
rewrite ^/media/images/order-by/([^/]+) /index.php?media=1&order-by=$1;
rewrite ^/media/videos/order-by/([^/]+) /index.php?media=2&order-by=$1;
rewrite ^/media/videos /index.php?media=2;
rewrite ^/media/images /index.php?media=1;
rewrite ^/members$ /members.php last;
rewrite ^/members/(.*)$ /members.php?section=$1;
if (!-f $request_filename){
    set $rule_14 1$rule_14;
}
if (!-d $request_filename){
    set $rule_14 2$rule_14;
}
if ($uri !~ "^/image/"){
    set $rule_14 3$rule_14;
}
if ($uri !~ "^/video/"){
    set $rule_14 4$rule_14;
}
if ($rule_14 = "4321"){
    rewrite ^/(.+)??(.*)$ /member.php;
}
if (!-f $request_filename){
    set $rule_15 1$rule_15;
}
if (!-d $request_filename){
    set $rule_15 2$rule_15;
}
if ($uri !~ "^/image/"){
    set $rule_15 3$rule_15;
}
if ($uri !~ "^/video/"){
    set $rule_15 4$rule_15;
}
if ($args ~ "^(w+)=(w+)$"){
    set $rule_15 5$rule_15;
    set $bref_1 $1;
    set $bref_2 $2;
}
if ($rule_15 = "54321"){
    rewrite ^/(.+)??(.*)$ /$bref_1/$bref_2?;
}


How to Disable Blur and/or Icon Hovers

<!-- START CODE SECTION -->

// STYLE.LESS
//Find this code and modify it - set to 0px and/or visibility=hidden;

        &:hover + img {
            -webkit-filter: blur(2px);
            filter: blur(2px);
        }
    }

    &:hover .meta-image{
        -webkit-filter: blur(2px);
        filter: blur(2px);
    }

    &:hover>.ib-icon {
        visibility:visible;
    }

<!-- END CODE SECTION -->


How to Disable Favorites Count Next to Heart

<!-- START CODE SECTION -->

// METHOD 1: CSS/CUSTOM-STYLE.LESS
// Simply add the following code to the custom-style.less file.
// The same method can be used for the Comment and View counts.
// Ensure development mode is turned on in the Mokoala CMD (Default is on) to recomplie your css changes.

    section.content {
        .awesome-gallery {
            li {
              .meta-icons {
                   .meta-hearts {
                        .text {
                            display: none;
                        }
                    }
                }
            }
        }

        &.gallery-single {
            .single-image {
                .image-container {
                    .meta-data {
                        .meta-hearts {
                            .text {
                                display: none;
                            }
                        }
                    }
                }
            }
        }
    }

<!-- END CODE SECTION -->


How to Disable Specific Fields in Member Profile Page

<!-- START CODE SECTION -->

// METHOD 1: CSS/STYLE.LESS
// Hides website field = nth-child(3)
// Find and modify the following class:

    .region-holder {
        .meta-web:nth-child(3) {
            display: none;
        }
    }

// METHOD 2: INCLUDES/MEMBER-PROFILE.PHP
// Hides website field
// Find and replace this code:

    if( $website <> '' || $admin_mode ==1 ) {   

// with the following:  

    $disabled=true;
    if( ($website <> '' || $admin_mode ==1) && ($disabled==false) ) {


// METHOD 3: INCLUDES/MEMBER-ABOUT.PHP
//Find and replace this code
//hides about field

    if( $about <> '' || $editing_mode == 1 || $admin_mode == 1) {

// with the following:

    $disabled=true;
    if( ($about <> '' || $editing_mode == 1 || $admin_mode == 1) && ($disabled==false) ) {      


<!-- END CODE SECTION -->


How to Change the Size of Images Displayed in the Gallery

We're going to add this option in the admin panel on the next update. Until then, it's important to take several factors into consideration, such as responsiveness, image sizes, youtube, vimeo, and retina. We suggest that you do not change the width, and keep the columns intact, unless you are an advanced web developer.

<!-- START CODE SECTION -->

// METHOD 1: CSS/STYLE.LESS
// Find the following class: (line 1156)

    .awesome-gallery {

//Then look for 

    span.image {

//Then modify

    min-height:169px;
    max-height: 169px;

//You'll also need to modify the Vimeo and Youtube min-height and max height a few lines below:

    &.youtube {

        max-height: 169px;

    &.vimeo {

        max-height: 169px;

// METHOD 2: _VARIABLES.PHP
// Use this method if necessary, in conjunction with method 1 or 3 
// Find the following code: (line 57)
// These variables set the crop height and width.
// They are intentional set larger than the display size to account for retina displays

    $wib = 480; // width_image_box;
    $hib = 360; // height_image_box;


// METHOD 3: CSS/CUSTOM-STYLE.LESS
// Paste the following code into custom-style.less to create square images in gallery

    section.content {
        .awesome-gallery {          
            li { 
                figure {
                    span.image {
                        min-height:225px;
                        max-height: 225px;
                        &.youtube {
                            img {
                                max-height: 225px;
                            }
                        }

                        &.vimeo {
                            img {
                                max-height: 225px;
                            }
                        }
                    }
                }
            }
        }
    }


<!-- END CODE SECTION -->


How to Enable Approval Of Images

This is a very basic workaround for making sure that you approve each media item that is submitted to your gallery. We plan on releasing an integrated solution in the upcoming update.

STEP 1: Mokoala

Goto Backend->Settings . Set 'CMS Mode' to FULL ACCESS

Click Modules -> Create New Module Field

SET THESE FIELDS
Label Name: Approved
Name: approved
Type: Yes/No
Module: Media
Editable: Yes

Click SAVE

STEP 2) SQL

Run this SQL Statement in your Database to Set all your current media files to Approved.

UPDATE `mk_images` SET `approved`=1

STEP 3) Open /includes/functions.php (If WP Plugin, see plugins/awesome-media-gallery/amg/) *Step Was Recently Updated!

Within the BuildSearchOptions() function - find space between Gallery and Tag search criterias (near line 518) - and paste this snippet of code:

//Search Criteria for Approved Field
$search_criteria[] = array(
    'field' => 'approved', 'value' => '1'
);


How to Fix CSS for when Home Icon Floats Right in Header

This fixes a problem found on Chrome for Windows. A recent update has made the header menu appear buggy, and breadcrumb section floats to the right.

Install the following code under .header-container in style.less or custom-style.less

//fix for CHROME WINDOWS
#user-menu {
    .nav {
        .pure-u-13-24 {
            width: 54%;
        }
    }
}