• Tiếng ViệtTiếng Việt
Theo dõi
Lucid Gen
  • Digital Marketing
    • Email Marketing
    • Facebook
    • Google Ads
    • Zalo Marketing
  • Website
    • SEO
    • Website measurement
    • WordPress
  • Technology
    • Computer tips
    • Mobile
    • Utilities
  • Review
  • Marketing tools
No Result
View All Result
Lucid Gen
  • Digital Marketing
    • Email Marketing
    • Facebook
    • Google Ads
    • Zalo Marketing
  • Website
    • SEO
    • Website measurement
    • WordPress
  • Technology
    • Computer tips
    • Mobile
    • Utilities
  • Review
  • Marketing tools
No Result
View All Result
Lucid Gen
No Result
View All Result

Lucid Gen › Website › WordPress › How to add effects to website logo

How to add effects to website logo

9
SHARES
879
VIEWS
Chia sẻ bài viết lên Facebook

A little shiny effect on the logo will help the menu bar become more vivid. Especially for those who use the logo design in words. According to Lucid Gen, the shiny effect on the logo is suitable for colored logo websites, and the menu bar background is white. You just try on your logo, maybe the web will be more beautiful. ^_^

Related posts

  • How to set up Wordfence Security Premium plugin
  • How to set up Contact Form 7 to connect to Google Sheet
  • Delete unused thumbnail images and disable automatic image creation in WordPress
Table of contents
  1. Steps to add effects to the website logo
    1. Specify the CSS component that envelops the logo
    2. Replace elements in light effect code for logo
    3. Insert into website and see results
  2. Ending

Steps to add effects to the website logo

Specify the CSS component that envelops the logo

On your website, right-click the logo and select Check to open the browser’s Elements window.

Right-click the logo and select Check (web logo shadow effect)
Right-click the logo and select Check

Check to see what’s the cover in addition to your logo image. Lucid Gen’s example is <h1 class=”site-title”> CSS can be identified as .site-title or h1.site-title.</h1> You can get it quickly and accurately by selecting the line of the elements and clicking the plus button “+” as shown in the image below.

Tip: usually it‘s not <img> good, it’s a card

Check to see what elements need more logo shadow effects
Check to see what elements need more logo shadow effects

Replace elements in light effect code for logo

There are 2 choices of shadow effects for the logo, the type 1 like Lucid Gen’s is two rays of light that glide past each other, type 2 like canhme.com’s is a ray of light lying on its side from left to right. Choose which one is “as you like” ^_^.

Please replace your CSS component in the 2 code below to see which one fits your logo. Replace it with “before or after,” in front of the colon.

Insert into website and see results

After editing the logo shadow code, please copy to one of the 2 areas you suggest.

  1. Inserts into the style.css file of the theme.
  2. Insert into the custom CSS area of WordPress Customization.

If your website isn’t WordPress, add a <style> và </style> tag before and after the code and then insert it in html.

As a result, it is a bit hard to see if you only look at the photo you took, look up at Lucid Gen’s logo above the menu. ^_^

Instructions for adding a shadow effect to the web logo
Shiny effect for logo
Logo shadow effect on mobile
Logo shadow effect on mobile

Ending

With just a few actions, you can make your monotonous logo more live, more luxurious with a shadow effect on the logo. If you can’t do it, or you can’t identify the CSS component to fix the code, comment below, I’ll determine to help you for free. If you have done, also comment to show off the beautiful logo ^_^.

Share4Pin1Share1
Next Post

How to share files on Google Drive with three types of permissions

How to enable 2-factor security for WordPress using SMS and Authenticator

How to buy apps on AppStore with MoMo e-wallet and Visa card

Leave a Reply Cancel reply

I will review and reply to all comments within the day. Please feel free to leave your comments on this article!

Your email address will not be published. Required fields are marked *

You will probably need it

Cách viết chữ in đậm trên Facebook và FB chat
Content marketing

How to write bold text on Facebook and FB Messenger

18/10/2020
0

How to write type on Facebook, write in bold, italic on Facebook, change the FB font on status. 100% of...

Read more

Recommended for you

Cách dùng phần mềm sửa lỗi ngữ pháp tiếng Anh Grammarly

How to use Grammarly software to correct English grammar

12/12/2020

How to add a logo to photos with a smartphone

18/10/2020

How to add effects to website logo

18/10/2020

How to install and use HTTrack on a Macbook

18/10/2020
Cách dùng Authenticator trên điện thoại và máy tính

How to use Google Authenticator on PC desktop

18/10/2020

Lucid Gen

Một blog chia sẻ về digital marketing, linh tinh về công nghệ và những gì có thể bạn cần mà tác giả biết.

Phát triển bởi một người thích viết blog
Trần Ngọc Minh Hiếu

Thống kê thời gian thực đã có 63 Bài viết và 1,907 Bình luận

Tiết lộ: Website này đã có quảng cáo. Không có tiền thì viết làm sao.

Recent Comments

  • Minh Hiếu on How to merge multiple Excel and CSV files into 1 sheet
  • Nguyenthoa on How to merge multiple Excel and CSV files into 1 sheet
  • Minh Hiếu on How to merge multiple Excel and CSV files into 1 sheet
  • Nguyenthoa on How to merge multiple Excel and CSV files into 1 sheet
  • Minh Hiếu on How to hide all files and icons on the Mac desktop

Image sources

Lucid Gen edits images from the following sources: Freepik, Unsplash & Pixabay.

Subscribe to Blog via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

  • About
  • Contact
  • Terms and policies

© 2019 Lucid Gen with by Minh Hieu DMCA Protected

No Result
View All Result
  • Digital Marketing
    • Email Marketing
    • Facebook
    • Google Ads
    • Zalo Marketing
  • Website
    • SEO
    • Website measurement
    • WordPress
  • Technology
    • Computer tips
    • Mobile
    • Utilities
  • Review
  • Marketing tools

© 2019 Lucid Gen with by Minh Hieu DMCA Protected