{"id":261,"date":"2023-07-07T08:30:00","date_gmt":"2023-07-07T15:30:00","guid":{"rendered":"https:\/\/dejal.com\/blog\/?p=261"},"modified":"2023-07-07T08:30:51","modified_gmt":"2023-07-07T15:30:51","slug":"time-out-fixed-image-and-blog-themes","status":"publish","type":"post","link":"https:\/\/dejal.com\/blog\/time-out-fixed-image-and-blog-themes\/","title":{"rendered":"Time Out fixed image and blog themes"},"content":{"rendered":"

I got a support request for Time Out<\/a>, my popular break reminder tool, asking to display a fixed image during the break.<\/p>\n

Time Out uses HTML pages as break themes, so it is possible to have a fixed image as a theme \u2014 in fact the default theme, Icon<\/strong>, does just that, with the app icon.<\/p>\n

So one way to have a fixed image is to:<\/p>\n

    \n
  1. Choose the Reveal Themes<\/strong> command at the end of the Theme<\/strong> pop-up menu to open the Themes<\/strong> folder in the Finder<\/strong>.<\/li>\n
  2. Duplicate the Icon<\/strong> theme folder and give it a new name.<\/li>\n
  3. Replace the icon.png<\/strong> file with your chosen image.<\/li>\n
  4. Edit the index.html<\/strong> to adjust the name and size of the displayed image.<\/li>\n
  5. Edit the Info.json<\/strong> file to give the new theme a unique identifier etc.<\/li>\n
  6. Pretty easy. You can edit those files in TextEdit<\/strong> or any other text editor.<\/li>\n<\/ol>\n

    If the image is available on some website, it\u2019s actually a little easier. I have created an example theme on the Time Out extras<\/a> page:<\/p>\n

    Download the Ducks & Fish theme<\/a><\/p>\n

    You can edit a copy of this theme to use a different image:<\/p>\n

      \n
    1. Choose the Reveal Themes<\/strong> command at the end of the Theme<\/strong> pop-up menu to open the Themes<\/strong> folder in the Finder<\/strong>.<\/li>\n
    2. Add the Ducks & Fish<\/strong> theme, if not already.<\/li>\n
    3. Duplicate that theme and give it a new name.<\/li>\n
    4. Edit the Info.json<\/strong> file to give the new theme a unique identifier, and change the URL to the desired image.<\/li>\n<\/ol>\n

      (This got me thinking, and I spent an hour or so writing up notes on ways to make adding image-based themes even easier in a future version. I\u2019m always trying to improve the app.)<\/em><\/p>\n

      While I was at it, I also added four themes to display my four blogs; these are all included with Time Out by default:<\/p>\n