123
Views
5
Comments
Create a professional banner
Application Type
Reactive

Any idea on how to create a professional looking banner? I already try with the CardBackground widget, however it really looks scruffy.

Is there any examples anywhere about banner types and such?


This is an example of what I have to make

For now what I have, however the idea is to even exceed of what I have since this web page will be interactive. It doesn't necessarily have to be a copy but the feel should be the same. If there would be any templates i could find a way to make this happen

2018-12-09 19-13-19
Tiago Gomes

Hi Abdulkadir,

I'm almost sure you will not find any "component" to create the banner you need, but take a look at forge. Eitherway, what you asking is something that can be made putting together some containers, expressions and CSS until it gets what you need. You can probably create a pattern and then just adjust to your needs.

Regards,

UserImage.jpg
Kadir Aksu

Indeed I know that it is possible with CSS, I was however wondering if other people perhaps knew a forge that could help me progress faster. I have looked in to the forges but didn't really find anything for this yet. Like a parallax effect/banner with animations whatsoever. 

Sometimes people do send a forge that I can't find myself or even an OML that can help me out.

Still thank you!

2018-12-09 19-13-19
Tiago Gomes

Hi Adbulkadir,

This was the only one I have found: https://www.outsystems.com/forge/component-overview/9375/hi-banner-card

You can preview a demo on the following link: https://hiinteractive.outsystemscloud.com/hicomponentsgifs/

If you search for "Banner", you'll find some examples here.

Hope this helps,

Best regards

2021-03-05 13-56-11
Ricardo Pereira
 
MVP

Hi,

If you need some ideas or unblockers, maybe you want to take a look at this:

https://www.webtopic.com/css-banners/

It's not OutSystems but you can use this ideas to do it in OutSystems and reuse CSS code (since you can use can customize your CSS).


Best regards,

Ricardo Pereira

2022-09-05 08-23-51
Naveen N

@Abdulkadir Aksu  You can fix it with the css, just create the same in your personal environment and attach that oml, will fix and revert the updated one as per your mockup.

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.