![]() This exclusion zone indicates the distance any other graphic element or message can be positioned in relation to the mark. To keep the Drupal wordmark clear of any other graphic elements, there's an exclusion zone around it. svg in the following colors and formats: Web (RGB): blue, white, and black. It's the primary visual element that identifies Drupal. ![]() Always use an approved electronic version. The Drupal wordmark is the defining building block of its visual identity. The Drupal wordmark should never be embellished, outlined, or altered in any way. The policy also includes information on how to apply for a license, or to report a trademark violation. Print (CMYK): blue, and spot blue (Pantone 2995 Coated)īefore using the Drupal wordmark, please read the Drupal trademark and logo policy.The Drupal wordmark is the defining building block of its visual identity. Please review these usage guidelines before downloading the full logo set: Drupal's Wordmark If a new brand is added to the Simple Icons project but does not appear as an option in the Drupal field then raise an issue and I will update icon-data.json and tag a new release.The word "Drupal" and the wordmark logo are registered trademarks of Dries Buytaert.If a brand updates its icon, and the Simple Icons project has updated to use the new icon, then update the copy of Simple Icons in your libraries/simple-icons directory and the new icon should become available.Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. A list of all the available icons can be found in icon-data.json in the module's root W3Schools offers free online tutorials, references and exercises in all the major languages of the web.What icons are available/can I add an icon? ![]() AccessibilityĪ element is contained within each SVG with the name of the brand that is represented by the icon. Need to add an CSS class to the icons provided by this module? Override the template provided by this module and you can edit the markup of the element that wraps the icons. There is currently no need for configuration. Once the Simple Icons library is in the correct location (see Requirements) then you can install this module as normal.Īfter installation you will have a 'Simple Icons icon' field type and field formatter available, as well as the Twig function mentioned above. Once you have done this, running the following command from your Drupal site's webroot should return SVG markup:Ĭat libraries/simple-icons/icons/drupal.svg Installation Follow this guide then run the following Composer command: So, even though the membership base has dwindled as I stopped adding new content, it also has stayed relatively strong, especially for a product that hasnt been updated in over 5 years. My preferred way of doing this is via Asset Packagist. The tutorials on BuildAModule have stayed oddly relevant, even today, due to large organizations standardizing on older versions of Drupal. Make sure that you have extracted the contents of the Simple Icons repo to libraries/simple-icons. The slugs can be found in the icon-data.json file found in the module root. The Twig function accepts a single argument of the slug that represents each icon. No more support tickets to ' Add a link to X in the footer'!Īs a convenience and for non-CMS managed content a Twig function is provided to output a single icon: Then, if a client wanted to add a new social media profile they could do it all themselves, including supplying an icon. Or use Config Pages and a Paragraph type to do a similar thing (outputting the Config Pages entity as a block, just like a menu). When you click on it there is a nice zoom out heart animation that goes into the heart icon on the button. If your client has a list of social media profiles in their footer then you could build it as a Drupal menu, install the Menu Item Extras module, and then add a Simple Icons icon field to the menu. Path: Home » button button click animation valentines zoom Image: Like Button With Zoom Out Heart Animation GIF A simple like button for your webpage designed by Emil Andersson. This module allows your CMS users to use almost any major brand icon that they like, without you having to source, optimize, and upload these logos yourself. The icon is output as raw SVG markup so it can be easily styled with CSS, but the markup is sanitized before being output for security (just in case!)Įach icon is monochrome so fits easily into most designs and has been optimised for performance. Simple Icons provides a field widget/field formatter and Twig function to output one of 789+ brand icons from the Simple Icons project.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |