Coder Social home page Coder Social logo

google / product_video_ads Goto Github PK

View Code? Open in Web Editor NEW
38.0 12.0 13.0 81.92 MB

Product Video Ads is a solution to build video Ads at scale.

License: Apache License 2.0

JavaScript 13.66% HTML 14.93% SCSS 1.50% Shell 4.70% TypeScript 37.61% Dockerfile 0.12% Python 27.49%
video google google-merchant

product_video_ads's Introduction

Product Video Ads

PVA Logo

Product Video Ads is an open-source solution that builds videos at scale, by reading product data from Google Sheets or Google Merchant Center and generating videos with product information (name, image, price) automatically. These videos are automatically uploaded to YouTube or Drive, and can be configured to Google Ads campaigns.

The integrated installer will setup the project on Google Cloud so you are up and running right away.

How does it work?

  1. PVA works with a base-video, which is a template for the offers video. The average market video consists of an introduction, offers and closing, as described in the image below:

    PVA Example

  2. After you have selected a base-video you just need to configure your offers inside PVA, using your feed as in the example below:

    PVA Demo

  3. Then, you can upload your video to YouTube and it can be used as a Google Ad. Updating your video in PVA will update the Ad automatically. Here's one example of a video ad generated with PVA:

    Carrefour Brasil - PVA Video

Requirements

  1. A Google Cloud Project with a user with Owner or Editor permissions (the installation will be on Cloud Shell)

  2. Apps Script enabled for the user involved on the deployment (can be a different user from the GCP)

  3. Access to your account or Brand Account. It's important to fetch the emails related to the deployment. If you are using a Brand Account, you need to be the Brand Account Manager or Owner (the steps to fetch your brand account email is on the video)

1. GCP Configuration

  1. Go to 'APIs and Services' > 'OAuth Consent Screen'
    • Type: External (if using brand account), otherwise Internal
    • App name: The name of your PVA Application that will show up on the screen, e.g.: pva-video-upload
    • Developer contact info: Your development email
    • Scopes: Click 'Save and Continue'
    • Test Users: Add the emails that you are going to use for PVA (Brand Account included)
    • Click 'Save and Continue'
  2. Go to 'APIs and Services' > Credentials
    • Click 'Create Credentials > API Key' which will generate a new key related to your GCP Project ID
    • Click 'Create Credentials > OAuth Client Id':
      • Application type: 'Web Application'
      • Name: pva-web
      • Authorized JavaScript Origins: 'https://<your_project_id>.<your_region>.r.appspot.com'
      • Authorized Redirect URIs: 'https://<your_project_id>.<your_region>.r.appspot.com'
      • Click 'Create'
    • Click 'Create Credentials > OAuth Client Id'
      • Application type: 'Desktop Application'
      • Name: pva-desktop
      • Authorized JavaScript Origins: 'https://<your_project_id>.<your_region>.r.appspot.com'
      • Authorized Redirect URIs: 'https://<your_project_id>.<your_region>.r.appspot.com'
      • Click 'Create'

2. Run the Installation Script

Just for example, lets suppose that we have: [email protected] and [email protected]

  1. Open your project's Cloud shell.
  2. Run the following:
    git clone https://github.com/google/product_video_ads.git
    cd product_video_ads
    ./install.sh
  3. On first execution, it will enable the required APIs for your GCP Project: Drive, Sheets, YouTube and more. So, click Authorize.
  4. Your configuration choices made during the installation process are saved in pva.conf in case you need to re-run the installation. If you run into any problems, you can edit or delete this file with values of your choice. An example file is provided for reference or as a starting point (if you deploy to EU)
  5. [Desktop Credentials] Enter your Desktop Client ID and Client Secret, configured on Step 2 of the previous section ('pva-desktop')
  6. It will ask you for your Spreadsheet ID. If you don't have one, just leave it blank (it will be created)
  7. Ensure that Google Apps Script API is ENABLED for the deployment user in the Apps Script Settings, then press Enter
  8. Click on the URL. When selecting your account, remember that you CAN'T use your brand account on this step, because it will create your Drive and Sheets and it must be attached with an account that you can access, so we are going to use as example: [email protected]. Then, allow everything that is prompted
    • After selecting your account, you will see a ERR_CONNECTION_REFUSED, which is expected. Just copy the full localhost URL (it will look like: 'http://localhost:8080/?state=...') and paste it into the terminal.
  9. If everything is configured correctly, you will see your Drive and Sheets being created
  10. You will be prompted to use GCS if you want. If not, just leave it blank - PVA will use Google Drive as storage
  11. Now, you need to choose the GCP Region and Zone you want to use. You can use the default us-central1-a, or enter the full Zone name (Region will be inferred from that)
  12. Next, in case you want to use Google Container Registry different from the default one (gcr.io which sits in US), enter it to the prompt. Europe uses eu.gcr.io but the default should work for most installations. Leave blank for default
  13. [Web Credentials] Now, enter your Web Client ID (in this example we have created it as 'pva-web'. If you are using a Brand Account give access to Drive and Sheets on this account, like [email protected]
  14. Enter your API Key (not the Web Client ID Secret)
  15. Now the frontend will be deployed on App Engine and a GKE Cluster will be created (this will take some time)
  16. For the backend part (GKE), if it's the first time, PVA might throw an error 'Secret Not Found', which is okay. PVA requires another authentication to upload to YouTube (if necessary). Follow the same steps when prompted with a URL:
    • After selecting your account, you will see a ERR_CONNECTION_REFUSED, which is expected. Just copy the full localhost URL (it will look like: 'http://localhost:8080/?state=...'') and paste it into the terminal.
  17. If everything passes without errors, Congratulations! The installation is complete.
    • Click on the App Engine URL to run your app. And use the Sheet's ID prompted to log in
    • IMP: Ensure cookies and pop-ups are allowed (Allow pop-ups in Chrome)
    • You should see this screen: PVA Frontend
    • After logging in, try to generate the video and upload it to YouTube. If anything fails, please see our Troubleshooting section

3. Test

  1. After login, go to Generate > Select Base Example > Price

    PVA Video Config

  2. To test the Youtube Upload, click Create One (YouTube)

    PVA Video Config

  3. To test, set:

    Offer Type: My Test

    Product: Your Product Name

    All other fields: Leave blank

  4. Click 'Create Asset'

    PVA Video Config

  5. On Generator Logs, you can click on 'Update' to see PVA processing on GKE. And in Assets, you can see your video status.

    PVA Video Config

Troubleshoot

Kubernetes:

gcloud container clusters get-credentials video-generator-cluster --zone us-west1-a
kubectl get pods

If the Pod status is different from 'Running', use:

kubectl logs <pod_name>
kubectl describe pod <pod_name>

Common errors are lack of permission and permission denied when accessing Sheets and Drive. If you encounter more errors and have solved them, feel free to contribute.

Contribute

PVA is an open-source project, so you can help us improve the application! Every push will trigger a CI/CD application which we will verify its integrity. Aafter that, if everything is fine, we are going to merge your pull request :)

Optional: Check that your Spreadsheet has access to Google Merchant Center as follows:

  1. [Optional] Navigate to Tools > Script Editor > Settings (gear icon)
    1. Update the GCP Project ID
    2. Test the Google Merchant Center connection by
      1. Add an ID on "Prices" tab in the format <Google Merchant Center id>:<product id>
      2. Click Merchant Center > Run Now

product_video_ads's People

Contributors

adilbaig avatar anaesqueda avatar astivi avatar caiotomazelli avatar hiroferreira avatar ishatrip avatar lucasrsant avatar mr-lopes avatar paranerd avatar qbit-42 avatar rickygodoy avatar roberto-goncalves avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

product_video_ads's Issues

Modification of the layers of video

Hi Guys,

Sorry that i'm writing this to here, but i couldn't find any better channel to ask this questions (probably this issue will be deleted, but maybe :))

this video creator application is great, and it would be a be benefit for me, but i have a big problem

i could find the information about the change of the layers, like background, different type of characters, transition of the image.
there is any way to modify these?
many thanks
a

Remove Cloud Storage dependency.

Currently the Product Video Ads uses the Google Cloud Storage to keep the OAuth token persisted. This dependency of Google Cloud Storage should be removed and the token should be persisted directly into the Docker image.

Text direction

Hello, hope I'm writing in the right place...
When adding product titles in a language that it's writing direction is right to left the letters are displayed in a reverse order.
If I want to have titles in Hebrew or even mixed Hebrew and English it's currently impossible.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.