Azure Text - Text to Speech Converter Documentation

Version 1.0 Last Documentation Update - 24/04/2022

Welcome

Thank you for purchasing Azure Text - Text to Speech Converter Laravel Script. We covered almost everything in this document that how easily you can setup this script. We really do appreciate every sale. If you like our work please do not forget to rate it. It helps us in developing new and better cloud solutions.

Author: Berkine
Demo: Azure Text - Text to Speech Converter Demo

Requirements

Before installation, your server must have following requirements to run the script properly
  • PHP v7.4 or higher
  • PHP Mbstring Extension
  • PHP PDO Extension
  • PHP JSON Extension
  • PHP CURL Extension
  • PHP FileInfo Extension
  • Support for MySQL v5.x

Installation Instructions

This is a general installation overview of the script, there is a deep dive section provided for each part in the left menu bar.

Follow the steps as explained, and you should be all set. If you face any challenges with installtion steps, reach out to us for a support.

Setup overview:

  • Step 1: Unzip and upload only the contencts of Google Wavenet to the root directory of your hosting server- Ex: /home/username/public_html/. Which will make it reachable as follows: https://yourwebsitename/
  • Step 2: Make sure your domainname points to the public folder only. So in your settings, path for your domain must be: htts://yourwebsitename/public. In case if you don't point your domain to public folder, we also include custom .htaccess file in the root directory for your convenience, it will automatically point requests to public directory in the script.
  • Step 2a: Warning! Some hosting platform hide files starting with '.' (hidden files), so make sure that in your settings of your cPanel you enable this option.
  • Step 2b: Warning! If your local Windows/Linux/MaxOS environment does not show hidden files, and you are planning to upload the script via FTP, make sure you enable viewing hidden files locally first even before unzipping, otherwise you will not upload all hidden files such as .env/.htaccess to your FTS server simply because your local environment will not see them.
  • Step 3: Everything inside of the public folder is accessible by anyone, so make sure you don't put anything sensitive there such as google json keys, etc.
  • Step 4: After uploading all files and making sure that domain name has proper path set, create Mysql Database and proper user in case if you don't already have one, to access this database. You can either create manually via your phpMyAdmin panel or use phpMyAdmin Wizard in your cPanel to create one.
  • Step 5: Now you are ready to run the install script. Go to https://yourwebsitename/install or if you skipped Step 2, go to https://yourwebsitename/public/install.
  • Step 6: This will start the installation process, click Start Intallation button.
  • Step 7: Make sure that all required php packages are installed and enabled on your server. Click Next to continue.
  • Step 8: Make sure all listed folder are publicly accessbile. Click Next to continue.
  • Step 9: For database configuration, enter your newly created database credentials. DB Server: localhost, unless your database resides somewhere else. MySQL DB Port: 3306, unless you are using some other port.
  • Step 10: On the final step enter your Envato License key for this product and also your Envato Username. In case if you don't know where to get your license, you can check this article.
  • Step 11: After installation is complete, you are now fully ready to start. The default login name is: admin@example.com and default password is: admin12345. You can change it after loggin in in your profile settings.
  • Step 12: Login as admin and configure SMTP Settings under Admin Panel - General Settings - SMTP Settings. Make sure your SMTP settings work by sending a test email. Without correct SMTP settings, you cannot activate email verification feature for new users.
  • Step 13: To start using Azure Text - Text to Speech features, activate Azure vendor and enter its respective Azure Key under Admin Panel - TTS Management - TTS Configuration and select the correct Azure Region.
  • Step 14: Following step is required: After installation is completed successfully, go to vendor/ffmpeg folder in the root directory of the script.
  • Step 15: Change file permission of ffmpeg to be executable by anyone.

Database Setup in phpMyAdmin

To run admin panel properly and fetch the application useage data and to set the settings you will need to setup MySQL database 5.7.

How to create new Database in phpMyAdmin:

  • Step 1: Login into phpMyAdmin.
  • Step 2: Click on New button to create a new database.
  • Step 3: Provide database name and select utf8_general_ci as collation and click create button.
  • Step 4: Make sure you have database user who can access this newly created database, if not you will need create one with all permissions and set a password
  • Step 5: Also, to avoid any issues with database setup, make sure your newly created database has InnoDB set as storage type
  • Step 6: Return to the Install process and enter your newly created database credentials. If using local server, you can set database host to localhost, and for mysql port use 3306

Azure Account Creation

Getting started with Microsoft Azure.

IMPORTANT: Azure is retiring the standard voices on 31st August 2024 and they will no longer be supported after that date. Azure has announced this in emails sent to all existing Azure TTS users created before 31st August 2021. During the retiring period (31st August 2021 - 31st August 2024), existing Azure standard voice users can continue to use standard voices, but all new users/new speech resources can choose only neural voices. (Basically all standard voices will not work for all new Azure TTS users anymore, and available only for users who were using Azure standard voices before August)


How to Create Microsoft Azure Account:

  • Step 1: Go to the Azure home page.
  • Step 2: Create new account and afterwards sigin into your Azure Portal under your Profile on the top right corner.
  • Step 3: Click on Create a resource.
  • Step 4: Search for keyword: speech and select the first Speech service from Azure.
  • Step 5: Afterwards, click Create button.
  • Step 6: Fill in the required information.
    • Name: Any string to identify this resource
    • Subscription: Free Trial (default)
    • Location: select Azure region as you prefer. Warning! Not every language/voice is available in all Azure regions, we strongly recommend to consider either US East or West Europe regions.
    • Pricing Tier: Free F0 is good for starting only, it has limitation in concurrency, refer to Azure Documentations to get exact numbers. Standard S0 will start billing.
    • Resrouce Group: Any string to group your resources.
  • Step 7: Almost there, on this the next page click on Click here to manage keys.
  • Step 8: Copy one of the keys.
  • Step 9: These keys are used to access your Azure TTS Service API. Do not share your keys. Store them securely– for example, using Azure Key Vault. We also recommend regenerating these keys regularly. Only one key is necessary to make an API call. When regenerating the first key, you can use the second key for continued access to the service.
  • Step 10: Go to Admin Panel, TTS Management -> TTS Configuration, and enter API Key for Azure, make sure you select proper Azure Region as shown in the previous step with your key.

SMTP Configuration

For sending all emails, such as email verification, support ticket creation etc, SMTP needs to be configured.

All the SMTP settings can be configured and set in Admin Panel under General Settings -> SMTP Settings.

Required SMTP Settings:
  • SMTP Host
  • SMTP Port
  • SMTP Encryption
  • SMTP EMail Login (Username)
  • SMTP EMail Password
  • SMTP Sender Email Address
  • SMTP Sender Name

Include Required SMTP Settings and click Save Changes button:



You can also test your SMTP Settings immediately via Test button:




If you are planning to use Gmail for sending emails:

In your Gmail Account settings, under Security tab, make sure your Less secure app access feature is turned on.



Google Analytics Configuration

Analyze in-depth detail about the visitors on your main frontend page.

Setup Google Analytics:

  • Step 1: Visit Google Analytics page.
  • Step 2: On the left menu select Admin.
  • Step 3: Click Create Property, **select Web and then Continue.**.

  • Step 4: After that it will appear screen with information for your website.
  • Step 5: Fill it and then click Create.
  • Step 6: Include Tracking ID into Google Analytics Tracking ID field in Admin Panel under General Settings -> Global Settings -> Google Analytics, and don't forget to enable the Google Analytics checkbox and click Save button.

Google Maps Configuration

To use the Maps JavaScript you must have an API key. The API key is a unique identifier that is used to authenticate requests associated with your project for usage and billing purposes.

To Get a Maps API Key:

  • Step 1: Go to the Google API Console
  • Step 2: Click the project drop-down and select or create project for which you want to add an API key and give it a project name.
  • Step 3: If you are using Google API for the first time you will see this screen after creating the project:
  • Step 4: Click Enable Apis and Services button or select Library button on the left.
  • Step 5: Find Maps JavaScript API and enable it as shown below.
  • Step 6: Click the menu button and select Credentials and click Create credentials > API key.
  • Step 7: The API key created dialog displays your newly created API key. Copy and paste it as shown in Step 8. The new API key is listed on the Credentials page under API keys.


    Important: Remember to restrict the API key before using it in production.
  • Step 8: Include the API key in Admin Panel under General Settings -> Global Settings -> Google Maps, and don't forget to enable the Google Maps checkbox and click Save button.


Change application restrictions:

Depending on your server/domain configuration the script maybe won't accept the HTTP referrers restrictions so try with changing the application restrictions back to None





Enable Billing on your project:

Sometimes after adding the key these features maybe won't work again. Then depending on the google account associated with the project created and maybe you will need to enable Billing.

Learn more here about it: Billing or here Getting started with Google Maps Platform

Google reCaptcha v3 Configuration

To avoid spams, all contact and registration forms have Google reCaptcha v3 enabled. It is optional feature, but strongly recommended.

To use this feature, you will need to have reCaptcha Site Key and reCaptcha Secret Key.

To Get a Google reCaptcha v3 Keys:

  • Step 1: Go to the Google reCaptcha Console
  • Step 2: Enter Label to identify your reCaptcha keys.
  • Step 3: For reCaptcha Type, select "reCAPTCHA v3":
  • Step 4: Enter your domain name.
  • Step 5: Accept the reCAPTCHA Terms of Service
  • Step 6: Click the "Submit" button.
  • Step 7: Copy both "Site Key" and "Secret Key".
  • Step 8: Include the API keys in Admin Panel under General Settings -> Global Settings -> Google reCaptcha, and don't forget to enable the Google reCaptcha checkbox and click Save button.

How to Customize Frontend

All frontend pagename.blade.php files consist of standard HTML + CSS Bootstrap structure. So it is easy to edit.

Warning: If you are planning to add heavy css customization, it would be better to create a separate css file and keep intact upon each update, otherwise next update might rewrite all previously made changes.

How to customize frontend:

  • Step 1: All files that are used as frontend pages or for frontend can be found under resources/views and couple files under resources/views/layouts directories as shown in the picture.
  • Step 2: For frontend styling we used SaSS, they can be found under resources/sass/frontend directory. If you plan to use sass files for customization don't forget to compile your sass files first to apply the effects. Otherwise, you can add custom css files into guest.blade.php below line 23. (With version 1.0.2 you will be able add directly via admin panel)
  • Step 3: All pages are stored direcly under resources/views directory and named accordingly. You can edit the text in any of these files as you prefer.
  • Step 4: If you want to add new page, make sure it has the same @extends and @section parts as in other pages.

Translate to other Languages

Cloud Polly by default is written in English Language, we also included as an example support for Spanish and French languages, translated by Google Translate (Warning! Quality of these translations might not be the best).

You can translate or add any language as you prefer.

How to Translate:

  • Step 1: Go to "Resources" -> "Lang" folder.
  • Step 2: Copy "en.json" to your desired language code. Ex: "ru.json"
  • Step 3: Translate only the value part, and make sure they stay within double quotes with comma at the end except the last value.
  • Step 4: Save your file in the same "Lang" folder.
  • Step 5: Go to "Config" -> "local.php" file.
  • Step 6: Add your new language code with proper fields: 'code', 'display', 'flag'. 
    'ru' => [
    'code' => 'RU',
    'display' => 'Русский',
    'flag' => 'ru'
],

CRON Job Configuration

IMPORTANT: Every hosting provider might have different CRON setup page and different path for PHP bin directory. Instructions below are provided based on our hosting - Namecheap, so path to PHP Bin and path to script can be different. Check with your hosting provider if you are not aware how to setup similar CRON job in your environment.

How to create CRON job in CPANEL:

  • Step 1: In your Cpanel find CRON Jobs option, it could be under Advanced panel as shown in the image.
  • Step 2: In the CRON Jobs panel add a New Cron Job. Select the minimum time that your hosting provider allows you to run a Cron Job (minimum you can get is 1 minute). Note: Not every hosting provider allows you to run Cron Jobs every minute, our hosting provider (Namecheap) for example allows to run only every 5 minute.
  • Step 3: Copy paste the command show in the first red box into the Command field.
    • /usr/local/bin/php /home/username/YOURDOMAINPATH/artisan schedule:run
    Important: Please note that above path of PHP bin directory and path for the directory can be different in your case. You might want to check with your provider to figure out where PHP bin folder is located in your hosting provider.


  • Step 4: After creating a CRON Job successfully you will see it listed among your Current Cron Jobs list:
  • Step 5: In case if your hosting allows you to enter entire CRON job command at ones, you can enter it in the following way (Keep in mind that if your hosting allows you to run tasks every minute, you will need to change */5 to */1):
    • */5 * * * * /usr/local/bin/php /home/username/YOURDOMAINPATH/artisan schedule:run

How to create CRON job in PLESK:

You might want to follow these instructions for Plesk at least on the setup part: Plesk CRON Instructions

Initial Release v1.0

Released on 18th April, 2022