VisioList 1.9

Mark

Administrator
Staff member
First, a huge thanks to Basti for implementing a more robust and extendable payment system, a lot of work went into that and its a massive improvement!


Fresh Install Instructions
Download VisioList1.9.zip from below
https://visiolist.com/docs/installing-visiolist

Upgrade Instructions - Basic
1) Take a backup of your files and database in case something goes wrong
2) Upload and replace all the files from the update bundle ( VisioList1.9-Upgrade.zip ) via FTP
3) Run yoursite.com/install/update.php from your browser.

Upgrade Instructions - Manual edits
If you upgrade from a version older 1.8, please check previous version upgrade instructions https://visiolist.com/docs/upgrade-from-previous-vl-version

Upgrade Instructions - Plugins
Run a plugin update check


Quick glance 1.9
  • New payment system, take note of manual updates. Custom plugins modifying premium form/buy in any way will need to be checked for compability.
  • Smaller issues from 1.8 fixed
  • Auto redirection when category urls are changed
  • You can now set your own category urls
  • fixed user banner upload. When a user had multiple sites and upload a banner for a sub account, it could overwrite the main accounts banner
  • user banner gif to mp4. New html structure for the frontend to give proper responsive video width. Take note of manual update instructions below
  • adscaptcha has been removed as we were made aware it doesn't even exist anymore
  • our session handler now makes use of random_bytes ( cryptographically secure pseudo-random bytes ) to generate sid's used across VisioList, e.g gateway. This is auto applied if your php version is 7 or higher (and everyone should be on PHP 7.4 by now), otherwise old behavior gets used. This change was done due high sid collision on very high traffic sites.

CSS Edits
Place the following into your custom themes css, it is already included in our default bootstrap theme:
CSS:
/* Fluid video/img */
.video-fluid,
.site-image-container video:not(.video-fluid) {
  max-width: 100%;
}
.img-fluid,
.site-image-container img:not(.img-fluid) {
  height: auto;
}
@supports (--custom:property) {

    .site-image-container {
        position: relative;
        display: block;
        max-width: var(--site-image-aspect-base);
    }
    .site-image-container::before {
        content: "";
        display: block;
        padding-bottom: calc(100% / (var(--site-image-aspect-ratio)));
    }
    .site-image-container img,
    .site-image-container video {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        object-fit: fill;
    }
}


/* Form elements */
.g-recaptcha ~ .invalid-feedback {
    display: block;
}
.form-check ~ .invalid-feedback,
.custom-control ~ .invalid-feedback {
  display: block;
}


/* Payment providers */
.payment-provider::before {
    position: absolute;
    right: -15px;
    top: -15px;
    background: #fff;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    content: "";
    z-index: 998;
    opacity: 0;
}
.payment-provider.selected {
    border-color: #1ea01e;
    background: rgba(30,160,30,.3);
}
.payment-provider.selected::after {
    position: absolute;
    right: -12px;
    top: -12px;
    color: #fff;
    text-align: center;
    background: #1ea01e;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    content: "✓";
    z-index: 999;
}

HTML Edits
  • premium_form.html - This file completely changed, please replace the file and reintegrate possible changes you have. If you use default theme child folder, replace it there
  • premium_already_form.html - just styling update for bootstrap. Replace or compare to yours
  • user_cp_main_menu.html - if you are making use of premium and wish to show users their payment history, you can add the following ( depending on your skin ) to this file
    HTML:
    <li class="nav-link"><a href="{$list_url}/index.php?a=user_cpl&amp;b=payment_history">Payment History</a></li>
  • The following edit can be skipped if you dont make use of gif to mp4 convert using ffmpeg.
    If you do use it, read on. We suggest to apply this anyway in case you ever start using ffmpeg.

    In the listed files IF you display the member banner in them
    • stats.html
    • table_top_row.html
    • table_row.html
    • table_top_row_premium.html
    • table_row_premium.html
    • search_result.html

      Banner codes should look like this by default prior to 1.9
      HTML:
      <a href="{$url}" onclick="out(this,'{$username}');" rel="nofollow">{$banner}</a>
      You need to change them to add a class and style ( This is ffmpeg responsive video fix ). It should look like this
      HTML:
      <a href="{$url}" onclick="out(this,'{$username}');" rel="nofollow" class="site-image-container" style="{$banner_aspect_base} {$banner_aspect_ratio}">{$banner}</a>
      The new code is this bit: class="site-image-container" style="{$banner_aspect_base} {$banner_aspect_ratio}"


New HTML files
Copy this files from default skin over to your own custom skin if you do not use default bootstrap with child theme.
  • payment_email_admin.html
  • payment_email_user.html
  • payment_form_Coinbase.html
  • payment_form_Coinbase_javascript.html
  • payment_form_Paygol.html
  • payment_form_PayPal.html
  • payment_form_provider_javascript.html
  • payment_form_Stripe.html
  • payment_form_Stripe_javascript.html
  • payment_history.html
  • payment_history_row.html - This file makes use of bootstrap collapse ( clicking transaction id in the table reveals details ). If you do not use bootstrap, you need to implement this functionality, or do not use it.
  • payment_return_cancel.html
  • payment_return_success.html
  • premium_form_discount.html
  • premium_review.html

Removed HTML files
  • join_adscaptcha.html
  • payment_premium_ko_return.html
  • payment_premium_ok_auto.html
  • payment_premium_ok_manual.html
  • payment_premium_ko.html
  • join_premium_email_admin_approved.html
  • join_premium_email_user_approved.html
  • join_premium_email_admin.html
  • join_premium_email_user.html
  • join_premium_review.html


If you have any questions, do not hesitate to ask.
Enjoy!
 

Attachments

Last edited by a moderator:
Top