PWA - Desktop Version | Scoreapps

PWA - Desktop Version

PWAs are Advanced Web Versions of a mobile App and are therefore designed and designed for use on mobile devices. However, you can customize the desktop view by adding CSS code in the step"PWA Custom CSS"which you will find within the sectionPWA > Creator of PWAfrom the left side menu of the builder:



1- Styles

Below we offer you the download of the css code of 6 styles to use the one you like best by pasting the corresponding code into the PWA Custom CSS


Idea
Style-1



Idea
Style-2



Idea
Style-3



Idea
Style-4



Idea
Style-5



Idea
Style-6





2- How to change the image of the QR code?

You can change the image of the QR code of the example to your PWA by following these steps:

1- Download the QR of your PWA:
Go to PWA > Creator of PWA, right-click the QR and select the option "Save Image as"



2- Then go to the "Image Url Generator" section (last icon of the builder's left side menu) and upload the image of the downloaded QR in the image upload box to generate


3- Copy the url that has been generated from the image



4- Now go back to the "PWA Custom CSS" section and replace the image url in the code and save the changes:




3- Example of CSS for text changes:

If you wish, you can change the texts (scan title or information text) and place the text you want.




Info
- Change the QR title:
.qr_title {visibility: hidden;position: relative;}.qr_title:after {visibility: visible;position: absolute;top: 0;left: 0;right: 0;content: "Scan QR Code"; /* New text}

Info
- Change QR information:
.qr_infovisibility: hidden;position: relative;}.qr_info:after {visibility: visible;position: absolute;top: 0;left: 0;content: "** Scan QR & Open a link into Android Chrome / iPhone Safari browser for an app like experience."; /* New text */}

    • Popular Articles

    • How to Create an App for Restaurants (with or without Delivery)

      Text Enter First Steps Once inside the platform, from the main dashboard you will find a series of icons on the left hand side menu. Just click on 'Apps'. Then click on 'Create App' and give it a name. Then you'll get to a screen where you choose the ...

    • APPS: Radio

      The function of Radio allows the addition of radio broadcast within its application. In addition to this function To add this function to your application go to step "Functions" and click on the icon "Radio": Once added you must name this new ...

    • APPS: Webhooks

      The advanced Webhooks feature lets you connect certain events that occur in your App by sending them to a URL called Webhook. You can use a free Webhooks service as Zapier to create automations that can help you with your App business. For example, ...

    • APPS: Audio & Music

      How to add this feature To add this feature to your application go to step "FUNCTIONS" and click on the " iconAudio": Then give this new section of the application a name. Then click on the + icon to add a new Playlist Then add a title and an image ...

    • QR Promotions

      This function would allow you to create discount coupons that would be unlocked by scanning a specific QR code. Once unlocked, the customer can use the discount whenever they want. The coupon would not appear in the application until the user has ...

    • Related Articles

    • PWA Versions (Progressive Web App) and How They Are Published

      A Progressive Web App (PWA) is a combination of a Website and a Mobile App. PWA´s use modern web capabilities to deliver an app like experience to the end-user. They work like web apps but users can install them (add the app to their home screen) ...

    • Common PWA Errors

      A continuación te explicamos los errores más comunes en PWA Lo primero que debes tener en cuenta es que la tecnología PWA está a mitad de camino entre una Web y una App nativa. Al igual que las Apps Nativas (Android e iOS) las PWA también tienen la ...

    • Customize PWA URL

      As a predefined way PWAs have a generic domain of the system (apps.nocode-builder........). It is advisable to customize the domain of your PWA to avoid conflicts in permissions and cookies that can be generated when the same device has several PWAs ...

    • How to Upload a New Version of the App to the App Store (Republish)

      ¿En qué casos es necesario subir una nueva versión de la App? A) Actualizar el código fuente de la App Será necesario actualizar el código fuente de la App subiendo una nueva versión en los siguientes casos: - Para que la App esté actualizada a las ...

    • APPS: Webhooks

      The advanced Webhooks feature lets you connect certain events that occur in your App by sending them to a URL called Webhook. You can use a free Webhooks service as Zapier to create automations that can help you with your App business. For example, ...