emilbaehr / automatic-app-landing-page

A Jekyll theme for automatically generating and deploying landing page sites for mobile apps.

Automatic App Landing Page

Create and deploy an iOS app landing page on GitHub Pages in only five minutes.

Designed for GitHub Pages for super easy set up.

🔧 Fork this repo

🗝 Enter iOS App ID in _config.yml

📲 Upload video preview or screenshot

🎨 Customise site in _config.yml (no HTML/CSS)

📝 Write Privacy Policy as markdown in privacypolicy.md

🕒 Keep a changelog in CHANGELOG.md

✅ Site becomes live at GitHub Pages repository URL, e.g. https://your-username.github.io/your-repo-name/.

Quick Start

Step 1: Fork this repo.

After forking the repo, your site will be live immediately on your personal Github Pages account, e.g. https://yourusername.github.io/your-repo-name/.

Make sure GitHub Pages is enabled for your repo. It might take some time for the site to propagate entirely.

Step 2: Enter iOS App ID in _config.yml

Enter your iOS app ID in the ios_app_id field and commit your changes. Your site will automatically rebuild with your app icon, name, price and link to App Store.

You can go on with customising almost anything in the _config.yml file.

Things you can customise in _config.yml:

• App Name
• App Icon
• App Description
• App Price
• App Store Link
• Play Store Link
• Press Kit Download Link
• Cover Image
• Cover Overlay Color
• Background Color
• Text Colors
• iPhone Device Color
• Your Name / Company Name
• Link to Website
• Social Links and Contact Info
• Feature List (Title, text, icon)

Step 3: Add screenshot or video

Adding a screenshot

Upload a .png or .jpg of your app to the folder assets/screenshot/. The name does not matter. Be sure to delete the placeholder yourscreenshot.png.

Adding video

Upload your video to the folder assets/videos/. To have support for most browsers, you need to upload two files – one for Safari and one for Chrome/Firefox.

Video formats supported by Chrome and Firefox:

• .webm
• .ogg

Video formats supported by Safari:

• .mp4
• .mov

Resolutions

The videos and screenshots must have one of the following resolutions:

• 828x1792
• 1125x2436
• 1242x2688

Step 4: Edit (or remove) Privacy Policy and Changelog

Your site automatically includes pages for a Privacy Policy and a Changelog. Change the content of these pages by editing the privacypolicy.md and CHANGELOG.md files in the _pages directory.

In each of the markdown files, you can set the include_in_header: value to either true or false. This determines if the page is included in the top navigation. By default, only the Changelog is included in the top navigation. The title of the navigation item can also be edited, by editing the title: in each markdown file.

If you need to, you can create additional markdown based pages just by creating an .md file like the privacypolicy.md and CHANGELOG.md files in the _pages directory.

Please note: The Privacy Policy and Changelog provided are written using dummy text, so please adapt each of them for your own app. You can also choose not to include these pages, by simple deleting the privacypolicy.md and CHANGELOG.md files.

Feedback

If you have feedback regarding bugs or improvements, open an issue, @ me on Twitter or write me an email. You can find my contact info on my website.

I'd love to see the sites you create using this little tool.

Credits

• Jekyll
• FontAwesome

Donations

Donations are welcome

Author

Emil Baehr

License

MIT License

automatic-app-landing-page's Issues

Admin plugin

Nice work!

You can integrate jekyll-admin plugin for more convenient way of changing front matter. This would require actually serving Jekyll locally though, but for those who are comfortable with it, it would be a nice little option.

Version for macOS App

Is there any template like this one for a macOS app?

Maybe it's a feature request 😁

Unable to fetch assets from assets folder

The code "file.path" doesn't fetch the assets properly if it is not hosted in GitHub pages.

Header not displaying app icon in pages

This is for when the app icon is explicitly set and not taken from the App Store.

The header displays the app icon correctly in the default layout.

However, in any of the pages layouts, it just displays a broken image as follows:

Language Support

Hi Team,

Is there any way to support many languages ?

TestFlight Link

Hi all, Is there any way I can replace the App Store link with a TestFlight link?

Thank you!

_config.yml

Instagram icon is not shown if user account specified in config

I noticed that this is missing - Twitter, FB etc. are there but not IG even though it is in the config.

Feature Request: Android

Thanks for all the hard work, this is a great project. It would be awesome if there could be a version of this for android as well. #featurerequest

Help adding app-ads.txt file

Admob wants us to add an app-ads.txt to our site. Suppose the domain is example.com, then the file must be found at example.com/app-ads.txt. A regular .txt file should be served without CSS. How can I do this?

Links

Good morning/afternoon/evening (depending on where you are in the world)

Firstly, I love this repo, I think it is a brilliant idea, and to the creator I would like to say a massive thank you.

This isn't really an 'issue', but more of an assistance request, and if anyone can help, I would greatly appreciate it.

I am basically trying to add a privacy policy and terms of use page, as Apple requires it for all iOS apps. Where should I place extra pages, to take advantage of Jekyll (which I am ashamed to say, I have never used)?

Any help would be great, even an article :)

Thanks guys.

App icon in header at Privacy Policy page won't load

I've provided custom app icon in config.yml, which loads fine on homepage. However it won't load at privacy policy page and when looking at the imgsrc link its looking in wrong directory ie domain.com/privacypolicy/assets/appicon.png

For example have a look at:

1. Home Page: imagitor.booleanbites.com
2. Privacy Policy Page: privacypolicy

Problem building on vercel

             Error: could not read file /vercel/path0/vendor/bundle/ruby/3.2.0/gems/jekyll-3.9.5/lib/site_template/_posts/0000-00-00-welcome-to-jekyll.markdown.erb: Invalid date '<%= Time.now.strftime('%Y-%m-%d %H:%M:%S %z') %>': Document 'vendor/bundle/ruby/3.2.0/gems/jekyll-3.9.5/lib/site_template/_posts/0000-00-00-welcome-to-jekyll.markdown.erb' does not have a valid date in the YAML front matter.
             ERROR: YOUR SITE COULD NOT BE BUILT:
                    ------------------------------------
                    Invalid date '<%= Time.now.strftime('%Y-%m-%d %H:%M:%S %z') %>': Document 'vendor/bundle/ruby/3.2.0/gems/jekyll-3.9.5/lib/site_template/_posts/0000-00-00-welcome-to-jekyll.markdown.erb' does not have a valid date in the YAML front matter.
Error: Command "jekyll build" exited with 1

trying to publish in vercel and having this issue. Im kinda new at this. Any suggestions?

Forking the repo doesn't create a github pages anymore

Following the instructions in the README and forking the repo doesn't create a Pages website, even after making sure a branch is chosen and Pages is enabled.

Adding registration forms

This is amazing! but as a non-web dude, I'm trying to add a registration form for my app release, and I'm really struggling. do you think you can add one? and I will of course connect it to whatever provider I want

Make this repo a template so we can use it multiple times

markdown files is not showing in the page.

Hey,
I added termsofcondition.md file to _pages folder but it does not appear on the page. What should I do?

My codebase link: https://github.com/yildirimatcioglu/savesocial

Video autoplay

The video does not autoplay.
Can I edit the settings so it does autoplay on load?

Support multiple screenshots

Upload multiple screenshots to the folder assets/screenshot/.

Additional Images?

Did something change to where adding additional images from assets isn't working as of late? I recently loaded this template for a new site, and am trying to add images to presskit.md and other pages using

![](/assets/image.png)

The image displays fine in the "Preview" pane on Github, but after publishing, the images don't show up. I have older sites deployed from this template that use this exact method that work fine.

Thanks!

@emilbaehr

Adding Open Graph meta properties

To make my landing page shareable, I've added a few og: tags to my head.xml . This worked perfectly, and I was wondering, would such an addition to this repository be appreciated? If so, I'd be happy to create a PR.

og:title, og:image, and og:description can all be dynamically set using {{ site.property }}. Not sure if what property we can use to dynamically set og:url.

Host it in our own servers instead of GitHub Pages

As I have my own server, I would prefer to host the page on it instead of hosting it in GitHub Pages. How could I do that? Is there a way to download the theme locally and then work just with it? I looked for the gem theme but I didn't find it.

Is there a way to avoid GitHub to publish automatically the generated site?

Thank you

Pull screenshots from iTunes Search API

Would it be reasonable to add an option where users can have the app screenshots pulled from the iTunes Search API?

This would reduce the friction of the tool even further (it's great btw, nice work!)

GitLab CI/Pages version

so I made a GitLab CI/Pages version.

https://gitlab.com/rjhancock/app-landing-page

<title> is not automatically populated

If you look at head.html, you see

<title>{{ site.app_name }}</title>

The page title is using the config. However by default it the title is not configured and the content is taken from iTunes so it "seems" to work.

It would be nice to also change the page title when it is loaded from iTunes.

Video autoplay

How do I set a video as autoplay?
I love this project!

Android Support

Landing page

E-RESULT

Mailchip or other email subscription

I would love to have an email subscription box to sync with Mailchimp or other similar services.

Is there a .well-known folder?

Hello,

I am trying to add my domain to the Associated Domains in Xcode. In order to do that, I need to place a file named apple-app-site-association inside the .well-known folder. How can I do that with this package? Thank you in advance!

Sincerely,
Iraklis Eleftheriadis

iPad app preview instead of iPhone?