Creating Stylish Salesforce Projects with Titan
Web Design at its Finest
With Titan Web, there’s always something new to learn.
Our platform for Salesforce continues to grow as we add cool yet professional features to help you transform your web page into an engaging, stylish, and interactive canvas for your users.
To keep you on your toes so you can turn dry content into smart yet sophisticated web pages, we have put together a string of articles and webinars to help you take advantage of Titan’s full suite of products for Salesforce.
Making Web Projects Come Alive
In our webinar, our Creative Director is joined by Yaron Ollech, our very own tech wizard from the Professional Services team, to demonstrate how you can make your web project in Salesforce come alive with Titan Web and Titan Styling.
Sometimes, being different and getting creative with your web page is okay.
You can build and design custom forms, landing pages, and portals in Titan Web to launch a fully responsive web page directly from Salesforce using our drag-and-drop web page builder.
By following some fantastic tips, you should be able to create a vibrant Salesforce project that will leave your end users wowed.
Robust Titan Solutions that you can Trust
The webinar commences with a sneak preview of Titan’s interactive suite of products that offers a powerful bi-directional sync with Salesforce so you can stop coding and start building. Take a look at some of the Salesforce – example projects below:
To learn more about how you can utilize Titan’s no-code form builder to your advantage and the many more products on offer, go onto our Titan website and book a demo today.
Unrivaled Creativity at your Fingertips
Yaron provides a rundown of the topics, such as the ins and outs of Titan’s no-code structure, personal styles vs. project styles, and ensuring your forms are aligned and well-spaced. Giving you tips, best practices, and how you can make the most of the Titan Styling for projects in Salesforce.
So, let’s get creative!
We believe in Creativity
What is the Web Builder Structure?
The builder is divided into five main areas, namely:
The Importance of the Layer List
The Layer List is a nifty widget that makes up every detail required in designing a web page, i.e., Strip, Columns, Container, and the elements within the strip, container, etc. Users can name the element, making it easy to search and identify.
Each layer in the list has an eye icon that allows you to control its visibility; you can hide or unhide the elements.
The order in which layers appear corresponds to the layer order on your canvas, allowing you to change the order of layers on the canvas.
Web design changes like fashion, so creating a web project with fewer bold, innovative, and exciting elements is essential.
The Canvas Explained
Using our professional web design features, you can customize the canvas, which means you can design your website exactly how you want.
From color to backgrounds to innovative features like images and videos, you have plenty of options. Think of the canvas as your company’s online art piece – everything from the written content to the colors and fonts you use should reflect your brand identity.
Note: Several interface levels are presented to the end user. A user can add elements to the canvas but not the area outside of the canvas. The Canvas lies above a Window, a separate screen area that can overlap, resize, and control depending on screen size and resolution.
The canvas is divided into strips – use strips to structure your web page and break it into horizontal sections, creating a more professional look and feel.
Add a strip by clicking on the + icon or through the element panel, choose a blank strip, or why not choose one from our template library, and insert a video or image or even change the color of your strip to create a stunning effect.
You can add Styling and create a unique web project with Titan Web.
Let’s start with Personal Styles. All the elements in Titan Web have the same basic structure, including the element itself and a label.
Once an element is selected on the canvas, its style settings are displayed in the “Properties” panel on the right.
Inside the Style tab, the style properties are divided into the same categories in each element: Font, Background, Size & position, Padding, Border, etc.
Users can apply Style changes to multiple elements. For example, you can also change the “label” color to green and the element background color to red. You can customize and personalize the element’s Style by changing these properties.
Amp up your web project with Style Classes, which lets you customize its layout, fonts, colors, and more.
A recommendation given is to use Global styles to save time and help users change the overall Style across their entire project without having to edit individual projects or pages.
Tips: The color picker is Titan Web’s ultimate web design tool. We allow users to choose their colors according to the company branding and save the palette before they begin working on their canvas. Once you have them saved, it eliminates the hassle of copying and pasting.
Adding a background to your web project is essential and the most popular to make it look captivating.
A simple way to add a background is using the Fill feature in Titan Web.
You can use a solid, textured, or gradient background to create contrast and depth, allowing your web page to stand out and get noticed. Gradients are a more subtle approach than solid colors.
Instead of using color, add an image as the background that allows you to grab the visitor’s attention and immediately relate your message visually.
If you dislike color or images as your background, choose a video and add it as a background. It will encourage visitors to stay and increase their browsing time.
Note that you can only apply the video background to a web project’s container or strip.
Alignment & Spacing Tools
You may experience minor alignment and spacing variations on your web pages, such as text rendering and overlapping elements.
By adding them to containers, columns, and repeaters, you can adjust your elements in just a few clicks to ensure their alignment on different browsers.
Is Spacing an issue due to the page design or the height of the page? No worries, you can easily have the spaces removed by adjusting the design or height.
Project (Customize) Style
With so many layouts, themes, and backgrounds, you can customize any web project with your color scheme with just a few clicks by using the Customize Style feature in Titan Web.
It’s important to note that Customize Style in Titan Web applies to elements by their type. For instance, an input field, like a number, a URL, or a text, is considered one type of element.
If you need more content, watch our webinar to learn how to use Styling options to create an engaging online presence.
So, now that we’ve walked you through styling web projects. It’s time for you to start designing and styling projects to rapidly grow your business.
Get Creative with Titan
We hope we have inspired you to create a stylish web project with our Salesforce project examples. If you have any questions or need us to provide you with a demo or Salesforce project idea, please contact us on our social media platforms below.
We look forward to hearing from you soon!
Disclaimer: The comparisons listed in this article are based on information provided by the companies online and online reviews from users. If you found a mistake, please contact us.