rlohmj

Hi @wpmudev-support8,

Thank you for the workaround.

I have informed my colleagues to do the rollback.

Hi @wpmudevsupport15,

Exported form with fake email in “email notification”:
https://pastebin.com/3jNF24t7

Unfortunately, the form is used on an internal site and I am not allowed to disclose it.

If a “live” form is required, I can put in a request to make a separate example site, but I doubt it will get approved.

Thank you.

Hi @themifyme,

I was asking if there is a way to add new conditions via a function rather than directly modifying the source “init.php” file of the plugin.

Notice how additional lines of code were inserted into the existing code inside the “init.php” file as seen in the initial message.

The method mentioned in the initial message is not plugin update friendly and I am asking how I can make adding new conditions update friendly.

Hi Peter,

Just to clarify any remaining doubts I have …

That means I need to call
$wpdadb = WPDataAccess\Connection\WPDADB::get_db_connection( 'your-local-db-name' );
rather than the usual
global $wpdb;
before this set of revised (replaced $wpdb with $wpdadb) codes

$param1 = $wpdadb->esc_like($wpda_shortcode_args['param1']);
$param2 = '%0' . $wpdadb->esc_like($wpda_shortcode_args['param2']) . '0%';
$my_result = $wpdadb->get_results(
    $wpdadb->prepare(
        "SELECT * FROM my_table WHERE my_col2 LIKE %s AND my_col3 LIKE %s ORDER BY my_col2 ASC",
        $param1,
        $param2
    )
);

and “your-local-db-name” is what is seen in the “Database” text field in your plugin screenshot here: WP Data Access plugin sample screenshot on wp.

Because my db is local rather than remote, it would be something like “dfg_d68fd” rather than “rdb:dfg_d68fd”.

Hi @peterschulznl ,

Once again I want to mention how awesome your plugins are!

Here’s an update regarding my hardcoded version and a question (at the bottom).

The full working code for “Home Carousels” Sample (rotloc type “sidebar” is prerequisite for using rotloc type “body”):

<?php
global $wpda_shortcode_args;
if (isset($wpda_shortcode_args['country']) && isset($wpda_shortcode_args['rotloc'])) {
    global $wpdb;
    $sitecountry = $wpdb->esc_like($wpda_shortcode_args['country']);
    $rotloc = '%' . $wpdb->esc_like($wpda_shortcode_args['rotloc']) . '%';
    $approveads = 1;
    $result = $wpdb->get_results(
        $wpdb->prepare(
            "SELECT * FROM rotatingads WHERE rotads_loc LIKE %s ORDER BY rotads_set ASC",
            $rotloc, // an unescaped string (function will do the sanitization for you)
        )
    );
    switch ($wpda_shortcode_args['rotloc']) {
        case 'sidebar':
            echo '<style>
            /* Style Sidebar */
            #featuredSideBar>div {
                box-sizing: border-box;
                width: 100%;
                margin-bottom: 5px;
            }
        
            #featuredSideBar>div:last-child {
                margin-bottom: 0px;
            }
            </style>';
            echo '<div id="featuredSideBar">';
            $slide = 0;
            echo '<div class="slideSet">';
            foreach ($result as $row) {
                if ($slide != $row->rotads_set && $slide != 0) {
                    $slide += 1;
                    echo '</div>';
                    echo '<div class="slideSet">';
                } elseif ($slide == 0) {
                    $slide += 1;
                }
                if (substr($row->rotads_link, 0, 4) == 'tel:' || substr($row->rotads_link, 0, 7) == 'mailto:') {
                    echo '<a rel="noopener nofollow" href="' . $row->rotads_link . '" style="text-decoration: none;">';
                } else {
                    echo '<a rel="noopener nofollow" target="_blank" href="' . $row->rotads_link . '" style="text-decoration: none;">';
                }
                echo '<img loading="lazy" src="' . $row->rotads_imgsrc . '" alt="' . $row->rotads_desc . '" style="width: 100%; height: auto;">';
                echo '</a>';
            }
            echo '</div>';
            echo '</div>';
            echo '<script>
            var SlideIndex = [];
            var SlideSet = [];
            for (var setnum = 0; setnum < jQuery("#featuredSideBar .slideSet").length; setnum++) {
                SlideIndex[setnum] = 0;
                SlideSet[setnum] = jQuery("#featuredSideBar .slideSet:eq(" + setnum + ") > a");
            }
            SlideMaker();
        
            function SlideMaker() {
                for (var setnum = 0; setnum < jQuery("#featuredSideBar .slideSet").length; setnum++) {
                    SlideIndex[setnum] = ShowSlides(SlideSet[setnum], SlideIndex[setnum] += 1);
                }
                slideTimeout = setTimeout(function() {
                    SlideMaker();
                }, 2000);
            };
        
            function ShowSlides(s, n, t) {
                if (n > s.length) {
                    n = 1;
                }
                if (n < 1) {
                    n = s.length;
                }
                for (var i = 0; i < s.length; i++) {
                    s[i].style.display = "none";
                    if (t != null) {
                        t[i].classList.remove("activeThumbDot");
                    }
                }
                s[n - 1].style.display = "block";
                if (t != null) {
                    t[n - 1].classList.add("activeThumbDot");
                }
                return n;
            };
        </script>';
            break;
        case 'body':
            echo '<style>
            /* Position the image container (needed to position the left and right arrows) */
            #featuredBody {
                position: relative;
            }
        
            /* Next & previous buttons */
            #featuredBody .prev,
            #featuredBody .next {
                cursor: pointer;
                position: absolute;
                top: 0;
                width: auto;
                padding: 5px 10px;
                margin-top: -27px;
                color: rgba(0, 0, 0, 0.5);
                background-color: rgba(255, 255, 255, 0.3);
                font-weight: bold;
                font-size: 10px;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                border-radius: 3px;
                -webkit-user-select: none;
                -ms-user-select: none;
                -moz-user-select: none;
                -o-user-select: none;
                user-select: none;
            }
        
            /* Position the "next button" to the right */
            #featuredBody .next {
                right: 0;
            }
        
            /* On hover, add a black background color with a little bit see-through */
            #featuredBody .prev:hover,
            #featuredBody .next:hover {
                color: white;
                background-color: rgba(0, 0, 0, 0.8);
            }
        
            /* Add a pointer when hovering over the thumbnail images */
            .cursor {
                cursor: pointer;
            }
        
            /* The dots/bullets/indicators */
            .thumbDot {
                cursor: pointer;
                height: 11px;
                width: 11px;
                margin: 7px 2px;
                background-color: #bbb;
                border-radius: 50%;
                display: inline-block;
            }
        
            .activeThumbDot,
            .thumbDot:hover {
                background-color: #717171;
            }
            </style>';
            echo '<div id="featuredBodyMiniPics" style="text-align:center; margin: 0; padding: 0; line-height: 0.5;">';
            for ($i = 1; $i <= $wpdb->num_rows; $i++) {
                echo '<span class="thumbDot" onclick="CurrentSlide(' . $i . ')"></span>';
            }
            echo '</div>';
            echo '<div id="featuredBody" style="width: 100%; margin: 0 auto; padding: 0;">';
            echo '<div class="slideSet">';
            foreach ($result as $row) {
                echo '<a rel="noopener nofollow" target="_blank" href="' . $row->rotads_link . '" style="text-decoration: none;">';
                echo '<img loading="lazy" src="' . $row->rotads_imgsrc . '" alt="' . $row->rotads_desc . '" style="width: 100%; height: auto;">';
                echo '</a>';
            }
            echo '</div>';
            echo '<a class="prev" onclick="PlusSlides(-1)">❮</a>';
            echo '<a class="next" onclick="PlusSlides(1)">❯</a>';
            echo '</div>';
            echo '<script>
            var slideTimeout;
            var thumbs = document.getElementById("featuredBodyMiniPics").getElementsByClassName("thumbDot");
            var bodyslides = document.getElementById("featuredBody").getElementsByClassName("slideSet")[0].getElementsByTagName("A");
            var slideIndex = Math.floor(Math.random() * bodyslides.length);
        
            function SlideActive() {
                slideIndex = ShowSlides(bodyslides, slideIndex += 1, thumbs);
                slideTimeout = setTimeout(function() {
                    SlideActive();
                }, 2000);
            };
        
            function PlusSlides(n) {
                clearTimeout(slideTimeout);
                slideIndex = ShowSlides(bodyslides, slideIndex += n, thumbs);
                slideTimeout = setTimeout(function() {
                    SlideActive();
                }, 5000);
            };
        
            function CurrentSlide(n) {
                clearTimeout(slideTimeout);
                slideIndex = ShowSlides(bodyslides, n, thumbs);
                slideTimeout = setTimeout(function() {
                    SlideActive();
                }, 5000);
            };
            SlideActive();
        </script>';
            break;
        default:
            break;
    }
}
?>

Going to work on the “Product List” and “Store List” now.

By the way, I notice that “PHP Shortcode” type was the only type with custom parameters tutorial in the DOCS. Can custom parameters be used in the other shortcode types as well?

Hi @peterschulznl

Sample ideal look from some other site:
1) example home page has carousel ads banner/img at sidebar and body:
home carousels
– the images/banners has hyperlink to relevant pages/sites.
2) example product category page has a header (red dots), 2 categories (black dots) and several products (green & orange dots)
product list initial load
– the images/banners has hyperlink to relevant product pages/sites.
3) example store category page has a list on the left side and an “IMG” area on the right.
store list initial load
– “IMG” area has some placeholder text to guide people to click something from the list.
1st click
– IMG banner shown after clicking something on the list.
2nd click
– IMG banner is replaced with new IMG banner when clicking something else on the list.
non banner type
– Example of non-IMG banner showing some details of the store.

I was allowed to see whats under the hood for those pages on that sample site and to modify them for my own use.
They used a json data array to store the info on each relevant page and used javascript to “create” the innerHTML in a procedural manner such that the only difference between similar page types is the json data only.

Example <script> used in sample (1) in its entirety, excluding the json data:

    /**
     *	Add/Change images to the list using the function "processRotatingData()".
     *
     *	Format of the function "processRotatingData()":
     *	processRotatingData([{
     *			"loc": "{sidebar / body}",
     *			"set": "{set number}",
     *			"desc": "{image short description / Company Name}",
     *			"source": "{image source}",
     *			"link": "{image hyperlink}"
     *		},
     *		{
     *			"loc": "{sidebar / body}",
     *			"set": "{set number}",
     *			"desc": "{image short description / Company Name}",
     *			"source": "{image source}",
     *			"link": "{image hyperlink}"
     *		}
     *	]);
     *
     *	For image sets that "rotate", use the same {set number}.
     *	"loc": "sidebar" starts with first image in the same set.
     *	"loc": "body" starts with a random image in the same set.
     */

    // Initiate JSON data processing
processRotatingData(some JSON data);

    // Process the JSON data
    function processRotatingData(rows) {
        // Iterate all rows and add slides
        for (var i = 0; i < rows.length; i++) {
            // Check last slide in set to start rotating
            var startRotate;
            if (i == (rows.length - 1)) {
                startRotate = true;
            } else {
                if (rows[i].set != rows[i + 1].set) {
                    startRotate = true;
                } else {
                    startRotate = false;
                }
            }
            slides_add(rows[i].loc, rows[i].set, rows[i].desc, rows[i].source, rows[i].link, i, startRotate);
        }
    }
    // append image to list and rotate when ready
    function slides_add(Loc, sI, Desc, Source, Link, thumbI, startRotate) {
        this.div = document.createElement("DIV");
        this.div.style.display = "none";
        this.div.className = "slideSet" + sI;
        if (Loc == "body" && document.getElementById("featuredBody") != null) {
            document.getElementById("featuredBody").appendChild(this.div);
            // thumb dots
            this.spanDots = document.createElement("SPAN");
            this.spanDots.className = "thumbDot";
            document.getElementById("featuredBodyMiniPics").appendChild(this.spanDots);
            this.spanDots.onclick = function () {
                currentSlide(thumbI + 1);
            };
            // thumbnails
            /*this.divMini = document.createElement("DIV");
            this.divMini.className = "miniPicContainer";
            document.getElementById("featuredBodyMiniPics").appendChild(this.divMini);
            this.imgMini = document.createElement("IMG");
            this.imgMini.className = "miniPic cursor";
            this.imgMini.style.width = "20%";
            this.imgMini.loading = "lazy";
            this.imgMini.style.height = "auto";
            this.imgMini.src = Source;
            this.imgMini.alt = Desc;
            this.imgMini.onclick = function() {currentSlide(thumbI+1);};
            this.divMini.appendChild(this.imgMini);*/
        }
        if (Loc == "sidebar" && document.getElementById("featuredSideBar") != null) {
            document.getElementById("featuredSideBar").appendChild(this.div);
        }
        this.a = document.createElement("A");
        this.a.rel = "noopener nofollow";
        this.a.style.textDecoration = "none";
        if ((Link.search("tel:") != 0) && (Link.search("mailto:") != 0)) {
            this.a.target = "_blank";
        }
        this.a.href = Link;
        this.div.appendChild(this.a);
        this.img = document.createElement("IMG");
        this.img.loading = "lazy";
        this.img.style.width = "100%";
        this.img.style.height = "auto";
        this.img.src = Source;
        this.img.alt = Desc;
        this.a.appendChild(this.img);
        // rotate if ready
        if (startRotate) {
            // only show selected image
            this.showSlides = function (s, n, t) {
                if (n > s.length) {
                    n = 1;
                }
                if (n < 1) {
                    n = s.length;
                }
                for (var i = 0; i < s.length; i++) {
                    s[i].style.display = "none";
                    if (t != null) {
                        t[i].classList.remove("activeThumbDot");
                    }
                }
                s[n - 1].style.display = "block";
                if (t != null) {
                    t[n - 1].classList.add("activeThumbDot");
                }
                return n;
            };
            if (Loc == "body" && document.getElementById("featuredBody") != null) {
                // prev & next buttons
                this.aPrev = document.createElement("A");
                this.aPrev.className = "prev";
                this.aPrev.innerHTML = "❮";
                this.aPrev.onclick = function () {
                    plusSlides(-1);
                };
                document.getElementById("featuredBody").appendChild(this.aPrev);
                this.aNext = document.createElement("A");
                this.aNext.className = "next";
                this.aNext.innerHTML = "❯";
                this.aNext.onclick = function () {
                    plusSlides(1);
                };
                document.getElementById("featuredBody").appendChild(this.aNext);
                // set thumbnail width
                /*var thumbs = document.getElementById("featuredBodyMiniPics").getElementsByClassName("miniPicContainer");
                for (var i = 0; i < thumbs.length; i++) {
                  thumbs[i].style.width = "calc(100% / " + thumbs.length + ")";
                }*/
                var thumbs = document.getElementById("featuredBodyMiniPics").getElementsByClassName("thumbDot");
                // get slides
                var slides = document.getElementById("featuredBody").getElementsByClassName("slideSet" + sI);
                var slideIndex = Math.floor(Math.random() * slides.length);
                // set slideshow functions
                var slideTimeout;
                this.slideActive = function () {
                    slideIndex = showSlides(slides, slideIndex += 1, thumbs);
                    slideTimeout = setTimeout(function () {
                        slideActive();
                    }, 2000);
                };
                this.plusSlides = function (n) {
                    clearTimeout(slideTimeout);
                    slideIndex = showSlides(slides, slideIndex += n, thumbs);
                    slideTimeout = setTimeout(function () {
                        slideActive();
                    }, 5000);
                };
                this.currentSlide = function (n) {
                    clearTimeout(slideTimeout);
                    slideIndex = showSlides(slides, n, thumbs);
                    slideTimeout = setTimeout(function () {
                        slideActive();
                    }, 5000);
                };
                // start rotation
                slideActive();
            }
            if (Loc == "sidebar" && document.getElementById("featuredSideBar") != null) {
                var slides = document.getElementById("featuredSideBar").getElementsByClassName("slideSet" + sI);
                var slideIndex = 0;
                this.interval = setInterval(function () {
                    slideIndex = showSlides(slides, slideIndex += 1);
                }, 2000);
                slideIndex = showSlides(slides, slideIndex += 1);
            }
        }
    }

Example <script> used in sample (3):

// The JSON data (if "bimg" == "-", it is Text Listing.)
var jsonData = [
    {
        "cname": something,
        "caddress": something,
        "ctel": something,
        "cemail": something,
        "cweb": something,
        "bimg": something
    },
    {
        "cname": something,
        "caddress": something,
        "ctel": something,
        "cemail": something,
        "cweb": something,
        "bimg": "-"
    }
];

// Initiate JSON data processing
processData(jsonData);

// Process the JSON data
function processData(rows) {
  // Iterate all rows and add Listing entry
  for (var i = 0; i < rows.length; i++) {
    listings_add(rows[i].cname, rows[i].caddress, rows[i].ctel, rows[i].cemail, rows[i].cweb, rows[i].bimg);
  }
}
// Banner & Listing Script from here onwards. (Do not edit.)
// append entry to list
function listings_add(cName, cAddress, cTel, cEmail, cWebsite, imgSrc) {

MIX OF: 
- something = document.createElement("something");
- something.style.something OR something.attribute = something;
- document.getElementById("something").appendChild(something);
- conditions to show "IMG Banner" or just "Text Listing", and other conditions...

}

You mentioned accessing the database directly using PHP and the WordPress class wpdb. I am trying to code it out right now.

Rather that hard coding it to fit my needs exactly, I wanted to make the code flexible to allow different “views” per se. If I’m not wrong, you are working on something similar for your “reports” feature for this plugin.

However, how do I include PHP codes into my website? I am not familiar with using PHP in WordPress. As mentioned before, I used Shortcoder to include my repetitive HTML/CSS/JS code snippets in specific pages, but the plugin does not allow the use of PHP.