Business Identy

• 

  360ohds · Member · May 4, 2017 at 6:06 am

  • Copy link
  • Add topic to favorites

  How to make my website clean and featured tag content font a different color so it can be read with background images. And is there any way i can make the slider images smaller?

  The blog I need help with is: (visible only to logged in users)

• 

  otpidusprime · Member · May 4, 2017 at 9:56 am

  • Copy link

  Hello @360ohd

  How to make my website clean

  I looked into your site. Here are some tips from my end, which might help you make your site clean:
  1. Header section:

  • You are currently using the phone number on the logo area and your site-title “360 Overhead Doors” on the top area with a small font size, make sure you switch their positions because when visitors visit your site they must be aware about your brand and the brand’s site.
  • The menu-item “Contact” is wrapping on a new-line as there is not much space left on the right side of the menu-bar. To solve this reduce the number of menu-items on the menu bar. If you want to have more menu-items, organize them inside a parent menu so that the sub-menus are only visible when someone hovers over the parent menu.
    Here’s the guide to set-up a sub-menu: https://en.support.wordpress.com/menus/

  2. Our Services section:

  • Reduce the number of “circled” images. Currently, they seem too much squeezed up.
  • Increase line-height of the texts:

    .entry-content {
        line-height: 3em;
    }

  3. Use more images:
  As we know that visual data communicates better than text-data, so make sure you use more images/videos where ever possible.

  These tips are just from my end, if any volunteer/staff can add some more tips it would be awesome!
   

  featured tag content font a different color so it can be read with background images

  You can change the font-color of the featured content tag, using this CSS code:

  #featured-content a {
      color: rgba(255,255,255,1);
  }

  However, it won’t affect much(as it’s readability is relative to the image you are using) and the text still won’t be readable on some really bright images.

  So here’s what I suggest, add a slightly dark overlay over the featured images so that the text is readable no matter what image you use.
  Here’s the CSS to add the overlay:

  .cover:before {
      content: "";
      background: rgba(0,0,0,0.3);
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      top: 0;
  }

   

  And is there any way i can make the slider images smaller?

  div.slideshow-window * img {
      max-width: 600px !important;
  }

  Although I have used 600px as the max-width you can change the value to achieve your desired look.

  Hope this helps 🙂