Twinr Builder Resources
  • πŸ™ŒGetting Started
    • What is Twinr?
    • Fun Fact
  • πŸ“±Create App
    • Create App from Template
      • Blank
      • E-Commerce App
      • News App
      • Restaurant App
  • πŸ‘₯Organization
    • Create Organization
    • Invite Members
  • πŸ–₯️Dashboard
    • App Dashboard
    • Preview App
    • Delete App
  • πŸ“²Setup Branding Info
    • App info
    • Launch screen
    • App Permissions
      • Camera Permission
      • Photo Library Permission
      • Microphone Permission
      • App Tracking Transparency
      • Location Permission
      • Read External Storage
    • App Settings
      • Enable portrait only mode
      • Prevent App Sleep
      • Enable/Disable iPad Support
      • Customize Minimum Android Version
  • 🎨Setup Theme
    • Overview
    • App Theme
      • Color Theme
      • Text Theme
      • Button Theme
    • Bottom Tab bar
    • Navigation bar
      • Button setting
    • Status bar
  • πŸ“²Screen Customization
    • External URL Handling
    • Apply Custom CSS
    • Apply Custom JavaScript
    • Hide Elements
    • Page Refresh
    • Login
      • General
      • Login Page
    • Tab bar(Bottom tabs)
      • Add New Screen
      • Delete Screen
      • Rearrange Screen
      • General
      • Navigation Bar
        • Navigation Bar Title
        • Navigation Bar Buttons
          • Back Button
          • Linker Button
          • Cart Button
          • Custom Button
          • Hamburger Menu
          • Native Link Sharing
          • Native Notification Screen Button
      • Tab Screen - External URL Handling
      • Responsible URL
      • Tab Screen - Hide Elements
      • Tab Screen - CSS
      • Tab Screen - Scripts
  • Native Screen
    • Title Element
    • Paragraph Element
    • Button Element
    • Image Element
    • Spacer Element
    • Divider Element
    • Banner Element
      • Banner Element(with Background Image)
      • Banner Element(with Background Color)
    • List Element
      • List Grid Element
      • List Vertical Element
      • List Horizontal Element
    • Product List Element
    • Setting List Element
  • πŸ› οΈApp Configuration
    • Add New Configuration
  • πŸ”—Extensions
    • Overview
    • Page Loader
    • Pull to Refresh
    • Custom User Agent
    • Custom Fonts
    • Cache Policy
    • No Internet View
    • App Review
    • App Onboarding
    • Multi Language
    • In-App Purchase (IAP)
      • iOS In-App Purchase (IAP)
      • Android In-App Purchase (IAP)
    • Deeplink
    • Force App Update
    • Account Delete
    • Dynamic Titles
  • βš™οΈIntegrations
    • Overview
    • Firebase Push Notification
      • Enable Push Notification
      • Send Push Notification
    • Push Permission Reminder
    • Personalized Push Notification
    • Abandoned Cart Push Notification
    • Native Notification Screen
    • AdMob
      • Create Android & iOS Apps
      • Create Ads on AdMOb
      • Setup AdMob Integration
    • Firebase Analytics
      • Auto Tracked Analytics
      • Custom Analytics
      • How to check Analytics in Firebase?
  • Plugins
    • Overview
    • WooCommerce
    • Shopify
    • Preshtashop
  • Engage
    • Overview
    • Engage Dashboard
    • One Time Campaigns
    • Event Triggered Campaigns
      • Order Created
      • Order Status Change
      • Product Created
      • Product Re-stock
      • Product Out-of-stock
      • Product Low Stock
      • Coupon Created
    • Welcome Push Notification
    • Inactivity Push Notification
  • πŸ“ŠApp Analytics
    • Overview
    • Acquisition & Retention
      • Number of Sessions
      • Number of Unique Sessions
      • Daily Active Users
      • Total App Sessions
      • New App Sessions
      • Session by Platform
      • Average Session Length
      • Session by Devices
      • Retention
    • Revenue
      • Sales
      • Orders
      • Total Revenue - Current vs Previous Period
      • Total Orders - Current vs Previous Period
      • Revenue by Device
      • Average Order Value by Device
      • Order by Device
      • Orders by New vs. Returning Users
      • Top 10 Popular Products
      • Promo Code Revenue vs Revenue
  • JS Bridge
    • What is the JS Bridge?
    • AdMob Interstitial Ad
    • Change App Language
    • Push Notification - Device Token
    • Request Account Delete
    • Native Datastore
  • πŸš€Publish Apps
    • Publishing to the Google Play Store
      • Setup Android Signing Information
      • Get Android Build File
      • Create Your Google Developer Account
      • Setup your App on Google Play Store
      • Submit Your App to Production
      • Reset Android Signing Key
    • Publishing to the Apple App Store
      • Create Your Apple Developer Account
      • Setup Annual Payment for your Apple Developer Account
      • Create Your Apple Bundle ID
      • Setup iOS Signing Info
      • Get iOS Build File
      • Add Users to Your App Store Connect Team (Optional)
      • Add Users to TestFlight (Optional)
      • Submit Your Build to The App Store
  • πŸ‘€Twinr Account
    • Change Password
    • Billing & Payments
    • Invoices
    • Update Payment Method
    • Enable 2-Step Authentication
  • πŸ‘©β€πŸ’ΌSupport
    • Contact Support
    • On-demand Services
      • End-to-End App Solution(All Inclusive)
      • App Development
      • App Publishing
      • App Screenshots
      • Login Script
      • Push Notification Setup
  • 🀝Partnership & Earnings
    • Twinr Partnership Model
    • Agency Plan
    • Become an Affiliate
  • ❓FAQs
    • Subscription
    • Preview your App
    • App Customization
    • Build APK & IPA
    • Publishing App
Powered by GitBook
On this page
  • Content Tab
  • ✏️ Add Your Text
  • Settings Tab
  • 🎨 Design Your Title
  • πŸ“ Margin Settings
  • πŸ‘οΈ Visibility Settings
  • πŸ“± How It Looks
  • πŸ” Summary

Was this helpful?

  1. Native Screen

Title Element

The Title element lets you add prominent text to your screenβ€”like a page heading or section title. This is usually the first thing your users see on the screen, so it’s important for setting the tone and guiding them through the app.

Twinr gives you two simple tabs to control everything:

  • Content Tab – where you type your text.

  • Settings Tab – where you style and adjust how it looks and feels.

Let’s walk through both tabs. πŸ‘‡


Content Tab

✏️ Add Your Text

  • Title Field: This is where you enter the main text.

  • Example: This is random text


Settings Tab

Here’s what you can customize:

🎨 Design Your Title

1. Text Style

  • Set to Custom for full control over size, weight, and color.

2. Font Size & Weight

  • Font Size: Choose how big your title should look (e.g., 20px).

  • Font Weight: Decide how thick the text appears (e.g., Bold 700).

3. Color

  • Pick from predefined styles like Heading or set a Custom Color using a HEX code.

  • Example: #171D1B is a bold black used for headings.

4. Text Alignment

  • Align the text to Left, Center, or Right.


πŸ“ Margin Settings

You can also add space (padding) around the title:

  • Top / Bottom / Left / Right margins can be adjusted using sliders.

  • Use the πŸ”— icon to link margins for symmetry.

  • Default spacing is 20px on all sides.


πŸ‘οΈ Visibility Settings

The Visibility section helps you control who can see the element and where it appears. This gives you flexibility to show different content to different users or on specific devices.

You can adjust visibility based on:

1. Platform

Choose which platform the element should be visible on:

  • All (default)

  • Android

  • iOS

2. Device

Control which device types will display this element:

  • All (default)

  • Mobile

  • Tablet & iPad

3. User

Target visibility by user type:

  • All (default)

  • Guest Users (not logged in)

  • Logged-in Users

πŸ“Œ Use Case Example:

Want to show a β€œWelcome Back!” title only to users who are signed in?

Set User to Logged-in Users.


πŸ“± How It Looks

As you update the content and settings, the preview in the center shows exactly how your app will look to users. No guesswork needed!


πŸ” Summary

Section
What You Can Do

Content Tab

Type your title text

Settings Tab

Customize font, color, alignment, and spacing

Live Preview

Instantly see changes on your app screen or look at preview app

PreviousNative ScreenNextParagraph Element

Last updated 9 days ago

Was this helpful?