When using fastlane frameit for screenshots, how do you stack the title and keyword text?

Question

I'm generating app store screenshots using fastlane frameit. How do you stack the keyword on top of the title like in the image below?

Answer 1

I had the same issue recently.

First of all, update to the latest version of fastlane using

sudo gem update fastlane

Next, follow instructions here:

Create Framefile.json in your screenshots directory (which was created by snapshot if you use it). Mine looks like this:

    {
      "default": {
        "keyword": {
          "font": "./fonts/SFText-Heavy.otf",
          "color": "#76A43B"
        },
        "title": {
          "font": "./fonts/SFText-Regular.otf",
          "color": "#FFFFFF"
        },
        "background": "./background.jpg",
        "padding": 50,
        "stack_title" : true,
        "show_complete_frame": false
      },
      "data": [
        {"filter":"Explore"},
        {"filter":"Search"},
        {"filter":"RecipeCard"},
        {"filter":"Groceries"},
        {"filter":"Favourites"}
      ]
    }

Note that "stack_title" is set to true.

Also you must provide a background picture, title.strings and keyword.strings (for each locale) for frameit to do its job.

Next you just launch frameit in your screenshots directory:

fastlane frameit

If you have any questions about strings files or something else, I strongly recommend you to visit frameit github page I've linked above. They have a very nice example there.

Answer 2

Just leaving this here because it took me an embarrassing amount of time to realize.

Since v 2.4.0 you can include \n in your string to have it go to the next line...

https://github.com/fastlane-old/frameit/releases/tag/2.4.0