The easiest option for static banner images (which has been added to all of our theme designs as-of March 2016) is to simply drag and drop a suitably-sized image into your main page container or styled text sidebar, named one of the following: The rest of the documentation on this page covers older or more advanced configurations of FreeStyle banners.Ī separate article has been written, all about RapidWeaver banners.Ĭreating a FreeStyle banner using dragged-and-dropped images There really is no need to read any further about FreeStyle, if your aim is just to setup a static image in your banner. If your goal is simply to add a custom banner image, then this solution should be perfect for your needs. All of our new and updated themes are compatible with this feature. You may not need to use FreeStyle!Starting in RapidWeaver 7, you will notice a drop zone in your main Site Settings and Page Inspector, where you can drag and drop a suitable image to use as a banner. Some of the methods outlined are ideal for novice RapidWeaver users wanting to avoid complicated code or configuration, whereas other methods will appeal more towards users seeking to warehouse static images or setup a greater number of custom banners within a project. There are several different ways to use FreeStyle and get attractive banners setup in your websites. Customise FreeStyle banners using your own custom CSS code like rounded corners, borders, box shadows, padding and margins.FreeStyle banners automatically resize, and do away with the need for complicated height, width, breakpoint and positioning settings.Any image in a FreeStyle banner is set to 100% wide by default, and scales down responsively to fit the screen size.Images used can follow any naming convention you already use, and can be in JPG, PNG or GIF format.Ability to assign attributes on the images (like title, width, height, language or ALT attributes), to improve SEO, navigation, performance and overall site accessibility. ![]() FreeStyle images can be pulled in from RapidWeaver resources, dropped into a page, sourced from an online warehouse, or pulled in from a website like Flickr.You can display different images on different pages, and not hit a 20 or 40 background image limit imposed by the theme. ![]() In particular, FreeStyle has the following advantages over traditional fixed-sized theme header and banner containers: ![]() As the name implies, the fundamental idea behind FreeStyle is to give you, the web developer, a very flexible space in which to create beautiful, fully-responsive theme banners and headers in RapidWeaver. FreeStyle should not be confused with a series of RapidWeaver themes from another company, also called 'Free Style'.įreeStyle is a sort-of hybrid between ExtraContent and the banner controls you may be used to in Concrete5 (if you've ever used Concrete5 before). The term 'FreeStyle' was coined by a ThemeFlood customer, who discussed the need for "a more free-style approach to theme banners and greater flexibility with what you can do in them". It became clear that many RapidWeaver users wanted greater freedom and flexibility after all the page header or banner is one of the most important parts of a page and often the first thing website visitors see. Although these worked okay, they could not resize easily on different screen sizes (due to fixed height or width settings applied) and typically you could only apply static images. In the old days of RapidWeaver themes, banner and header containers were typically formed out of a box container with a CSS background applied.
0 Comments
Leave a Reply. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |