Getting Started
Thank You for Choosing Our Theme!
We’re thrilled that you’ve selected our Rose theme for your Ghost website. If you run into any challenges or have questions, don’t hesitate to reach out via our email (trexthemes@gmail.com) — we’re here to help!
Getting Started with Rose
All the theme’s features, setup instructions, and customization options are thoroughly covered in this documentation. Use the On this page menu on the right to jump straight to any section.
Theme Details
- 🎨 Name: Rose
- ✍️ Author: T-Rex Themes
- 🛠️ Platform: Ghost
- 🔄 Latest Version: 1.0.0
- 📅 Last Updated: May 7, 2026
Requirements
Since Rose is a Ghost theme, it follows the same system requirements as Ghost. Before getting started, ensure you have:
- ✅ A working Ghost installation
- ✅ Basic familiarity with Ghost’s interface
🔍 New to Ghost? We recommend checking out the official Ghost Help Center for beginner-friendly guides and tutorials.
Installing Your Rose Theme
🚀 Welcome to Rose!
Follow these quick steps to install your new Ghost theme:
1. Download Your Theme
After purchase, you’ll receive a Rose.zip file containing your theme.
2. Log Into Ghost Admin
Access your dashboard at:https://yoursite.com/ghost
3. Upload the Theme
- Click the ⚙️ Settings icon (bottom left)
- Select “Theme” from the menu
- Choose “Change theme” → “Upload theme”
- Upload the
Rose.zipfile
4. Activate Rose
Once uploaded, click “Activate now” to apply your new theme.
🚀 Route Setup!
For the Rose theme to function correctly, you must upload the routes.yaml file. This step is separate from the theme upload and ensures that custom collections, navigation, and dynamic pages work properly.
How to Upload the routes.yaml File
- Access Ghost Admin: Log in to your dashboard at
https://yoursite.com/ghost/. - Navigate to Labs: Go to Settings → Labs (located at
https://yoursite.com/ghost/#/settings/labs). - Upload the File: Under the Beta features section, click the Upload routes file button.
- Select the File: Locate and select the
routes.yamlfile found within the root directory of the Rose zip file you downloaded.
[!IMPORTANT] Labs is a testing ground for experimental Ghost features. These settings may change or require updates as Ghost evolves.
Available Features in Labs
- Routes: Use the
routes.yamlfile to configure dynamic routing and custom URL structures. - Download: You can also download your current routes configuration directly from this menu to keep a backup before making changes.
🎉 That’s it! Rose is now ready to use.
💬 Need help? Contact our support team for assistance at trexthemes@gmail.com.
Homepage
This guide explains how to set up your homepage using the Rose theme in Ghost.
1. Header
Add Logo:
- Go to Ghost Admin → Settings → Design & Branding → Brand.
- Upload your Primary Logo:
- Find the “Publication logo” field.
- Click Upload logo and select your file.
- Click Save to apply changes.
- For dark mode logo:
- Go to Settings → Design & Branding → Theme.
- Upload your logo for dark mode.
Primary Color:
- Go to Ghost Admin → Settings → Design & Branding → Brand.
- Find the “Accent Color” field and choose your color
- For dark mode color:
- Go to Settings → Design & Branding → Theme.
- Find the “Accent Color for Dark mode” field and choose your color
Hero section:
- For H1 text (Name), Go to Settings → Design & Branding → Theme → Full Name.
- For Description bellow the title text, Go to Settings → Design & Branding → Theme → Bio.
- For Profession, Go to Ghost Admin → Settings → Title & Description → Site description.
- For Location, Go to Ghost Admin → Settings → Design & Branding → Theme → Location.
Adding Social Media Links
- Go to Ghost Admin → Settings → Social accounts.
- Add your links:
- Facebook: Paste full profile URL (e.g.,
https://facebook.com/yourpage) - X (Twitter): Enter handle or full profile URL (e.g.,
https://twitter.com/yourhandle)
- Facebook: Paste full profile URL (e.g.,
Other Social Networks
- Navigate to Settings → Design & Branding → Theme.
- Add your Instagram and Pinterest and the other profile link
2. Navigation
The Morning theme provides flexible navigation options.
📌 Primary Navigation
(Displayed at the top of your site)
- Go to Ghost Admin → Settings → Navigation.
- Click Customize next to Primary Navigation.
- Add/Edit Menu Items:
- Drag to reorder links.
- Click + to add new items.
- Click the trash icon to remove items.
- Click Save to apply changes.
➕ Secondary Navigation
(Optional menu for extra links or CTAs)
- In the same Navigation settings, click Customize next to Secondary Navigation.
- Build your menu following the same steps as above.
3. Recent Portfolio Images
This section automatically displays your most recent work. To populate it, follow these steps:
- Create a Post: Each portfolio item is managed as a standard PostRose.
- Automatic Display: By default, the theme pulls the latest posts into this section to showcase your most recent projects.
- Template Selection: In the right-hand settings panel, change the Template dropdown to
Portfolio.
4. Footer
- Logo ais displayed automatically if configured initially.
- To edit copyright text go to :
Settings → Design & Branding → Theme → Footer text
Collections
Blog Collection
To display a dedicated page for your standard articles with a “Load More” button:
- Create a Container Page: Create a new page and set the slug to
blog. - Title: The title you enter here will be the page’s main headline.
- Excerpt: The text provided in the excerpt field will serve as the page’s description.
- Internal Tag: Add the internal tag
#blogin the post settings (the#ensures it is hidden from your public tag list).
Portfolio Collection
To display specific details like Camera, Lens, or Shutter speed for an image:
- Code Injection: Open the Code Injection section in the right-hand post settings panel.
- Metadata Script: Copy and paste the following code into the Post Header area:
<script id="camera-info" type="application/json">
{
"title": "Camera Info",
"data": {
"Camera": "Sony A7 IV",
"Lens": "35mm f/1.4",
"ISO": "400",
"Aperture": "f/2.8",
"Shutter": "1/250s"
}
}
</script>
Customizing Metadata Groups
You can add multiple information blocks by following these rules:
- Unique IDs: Each
<script>tag must have a unique id (e.g., id=“location-info” or id=“gear-info”). - Flexible Labels: You can define any label and description pair within the “data” object to suit your needs.
Typography with the Rose Theme
The Rose theme gives you full control over the fonts used across your site. You can select from theme fonts, Ghost fonts, or system fonts, based on your preference for style and site performance.
How to Configure Typography
1. Log in to Ghost Admin
Go to:https://yoursite.com/ghost
2. Access Design Settings
Navigate to:Settings > Site > Design & branding
or visit:https://yoursite.com/ghost/#/settings/design
Click the Customize button to open the theme editor.
3. Open Theme Typography Settings
Find the Typography option under the Site wide section.
4. Choose Your Font Option
- Theme (default): Uses fonts provided by the Rose theme, we are using Google Fonts for optimal load speed and consistent appearance.
- Ghost: Enables fonts set in
Settings > Site > Design & branding > Brand > Typography. When selected, the theme’s default fonts are disabled to prevent redundant loading.
Translation
The Rose theme fully integrates with Ghost’s native translation system, allowing you to easily localize your website for a global audience. It uses simple JSON files stored in the locales/ folder to manage all text strings, making it straightforward to edit existing translations or add new languages.
How to Customize or Add Translations
1. Download and Unzip the Theme
Extract the theme .zip file on your computer.
2. Locate the Translation Files
Open the locales/ folder inside the theme directory. Here you’ll find JSON files named by language code, such as en.json or fr.json.
3. Edit an Existing Translation
Open the JSON file in a code editor (e.g., Visual Studio Code or Sublime Text) and modify the key-value pairs to your desired translations.
Example snippet from a translation file:
{
"Subscribe": "Inscreva-se",
"Read More": "Leia Mais"
}
4. Add a New Language (Optional)
- Duplicate an existing language file, e.g.,
en.json. - Rename the copy with your desired language code, such as
fr.jsonfor German. - Translate all the key-value pairs inside the file to your target language.
5. Repackage the Theme
Compress the entire theme folder—including your updated locales/ directory—back into a .zip archive.
6. Upload the Updated Theme
- Log in to your Ghost Admin panel.
- Navigate to:
Settings > Site > Theme > Change theme > Upload Theme - Upload the newly created
.zipfile containing your modified theme.
7. Set the Site Language
- Go to:
Settings > General > Publication Language - Enter the appropriate language code (e.g.,
esfor Spanish,frfor Arabic).
Important Roses
- Always use a code editor that supports UTF-8 encoding and proper JSON syntax to prevent file corruption.
- Avoid basic text editors like Rosepad or word processors such as Word, as they may insert hidden characters or break formatting.
Additional Resources
For comprehensive details on Ghost’s translation and localization features, see the official Ghost Localization Guide.