XenForo 2x How to add your logo in the editor

Admin

Administrateur
JustCoins
141
This Thread had not been rated yet
Versions compatibles XF 2.x
2.0, 2.1, 2.2, 2.3


Adding your logo inside XenForo's editor is a simple yet effective way to customize your community and subtly promote your brand. This guide walks you through the steps to achieve this subtle and professional customization.
  1. Access the Extra LESS Template
    • Go to your XenForo admin panel.
    • Navigate to Appearance > Templates
    • Open the extra.less template for the theme you want to customize.
  2. Add the Custom CSS Code
    • Copy and paste the following code into the extra.less template:


How It Works​

  • Desktop View:
    • Adds your logo (TESTLOGO.webp) as a subtle background to the editor. Don't forget to change my link to yours.
    • The logo appears in the bottom-right corner, resized to 300pxwith 20% opacity. Adjust as you prefer.
  • Mobile View:
    • Adjusts the logo for smaller screens using a media query.
    • The smaller logo (opacity.png) is resized to 30px for better fit on mobile devices. Don't forget to change my link to yours and adjust as you prefer.

  • Test Responsiveness:
    • Check how the editor looks on both desktop and mobile devices.
    • Adjust the logo sizes or placement as needed.
  • Backup Your Changes:
    • Always back up your extra.less file before making modifications.
  • Experiment Safely:
    • Use a test theme if you’re unsure about making changes directly to a live theme.
With this customization, your XenForo editor will stand out with a professional, branded touch! If you have any questions or run into issues, feel free to ask for assistance. Happy customizing!





1735732270440-webp.316743

1735732259978-webp.316742
 
This Thread had not been rated yet
Retour
Haut