App Inventor is a visual app-building tool, allowing you to simply drag and drop function and logic blocks to create a mobile app. In this tutorial, we show how you can use Enhance to integrate interstitial ads into your App Inventor project. Spoiler alert: it’s really easy! The following tutorial is also compatible with related software such as Thunkable and Appybuilder, which are based on App Inventor technology.
Step 1: Sign up to get started
If you don’t already have an Enhance account, start by signing up. It’s completely free!
Step 2: Navigate to the Enhance My App page and select the services you want to integrate. Since this tutorial is about interstitial ads, that’s what we’ll select here, but feel free to include other services you’re interested in at this point.
Step 3: Select App Inventor from the development platform list, then download our Drag and Drop library. You need this library in order to use interstitial ads, because the library allows your app to give more specific instructions to Enhance, such as when to show your ad.
Step 4: Now let’s head over to your App Inventor project, where you’ll import the Drag and Drop library. Once imported, then simply drag the extension onto your project board so you have access to the functions.
Step 5: Build a button to attach the Enhance functions to. If you’re following along, you might be wondering why we’ve attached an interstitial ad call to a button output. This tutorial is simply for demonstration purposes. Obviously you’d want to call an interstitial ad at a more intuitive point in your real world app, rather than on a button press.
Step 6: Drag and drop App Inventor logic blocks into the button object. Start by telling App Inventor that you want something to happen when a user clicks on our button.
Next, add a conditional if/then statement block, located in the Control category. This will tell the ad network to show an ad if one is available.
Head down to the EnhanceConnector extension that you added to your project at the beginning of this tutorial, and find the IsInterstitialReady function. This will be your “if” condition.
Using the same method, let’s fill the “then” condition with the ShowInterstitialAd function.
That’s it! You’ve “coded” everything that’s necessary to make interstitial ad calls in your app. Now that you’ve done this once, you’ll never have to edit the source again, because what you did was create a placeholder ad call. Now you can use Enhance to integrate any number of ad network SDKs into that placeholder!
Step 7: Export your Keystore file so you can sign your app (we’ll talk about this in a minute), and then save your project as a compiled APK from the Build menu in App Inventor.
Step 8: Head back to the Enhance website to upload the APK you just produced. If you did everything right in the previous steps, you will be taken to the SDK selector page where you can choose from over 40 ad networks that you want to call into your newly created interstitial ad placeholder. You can choose to integrate an already-established mediation platform, or you can integrate any number of direct ad networks to create your own mediation waterfall. For this tutorial, we’ll just integrate the Admob SDK.
Simply input your Admob Interstitial Ad Unit ID and click continue at the bottom.
Step 9: Input your signing certificate information. Start by uploading the keystore file we exported from App Inventor in step 7, followed by the password for that keystore. For App Inventor, the default keystore/certificate password is simply “android”. When ready, scroll to the bottom of the page and click “Enhance Now”.
You’re done! You’ve Enhanced your app, and Admob is now running in the placeholder we initially setup. If you want to integrate more ad network SDKs to be called when the interstitial ad placement is called, you only have to repeat steps 8 and 9 from our web interface. You won’t have to edit anything in your App Inventor project!
If you want to see the ad placement in action, check out the video that’s associated with this tutorial. If you want to learn more about Enhance, check out more articles from our blog. If you’re ready to integrate SDKs into your app, get started here.