Jump to content

Archived

This topic is now archived and is closed to further replies.

sheilahoff

Dropdowns, site speed, responsiveness

Recommended Posts

sheilahoff

I haven't done any DMS work in many months. I'm feeling very rusty. I'm picking up an old dev site again and the client is making many changes and demands. I particularly need input on the following for my dev site located at http://www.stacey.hoffmangraphics.com. Sorry for putting so much into one post.

 

1) The entire site is very slow. I do have caching disabled of course and I plan to wait until I'm done to optimize it. But she's complaining about the nav bar taking forever to bring up a page.

 

2) She's also complaining that her logo looks fuzzy to her. It looks fine to me. Someone sent me instructions about setting it up for Retina Display which is likely what I have to do as client is on a MAC. Does PL have any easy way for me to deal with this or is it all custom coding?

 

3) Morris from the UK helped me with this site ages ago and at that time he helped with a lot of custom CSS for responsiveness to assorted media. I know what he did is obsolete due to site changes. And I won't know how to do it. I'd like to hire someone to do that for me when the rest is done.

 

4) The one thing someone here MIGHT be able to help with is what custom CSS I need to use to get the drop down menu items to look better (ie: appear directly under the top level instead of pushed down, change the blue rollover color, remove the drop shadows, etc)

 

Thanks,

Sheila


Sheila Hoffman | Hoffman Graphics | Seattle

Share this post


Link to post
Share on other sites
Aires

Hi, sheilahoff

 

http://i.imgur.com/e3HrJku.png

 

The values   top:70% and left 15% are the values I used to get the dropdown menu  under the main menu.

 

hope this helps

 

Also it may just be my pc but the pages loaded fairly quickly for a first time visitor.


ndTgvai.jpg

Visit iheartpagelines.com for the latest tutorials on PageLines related products.

 

Share this post


Link to post
Share on other sites
sheilahoff

Thanks! That helped a lot. We'll see if she'll be OK with it now. She said she didn't like it looking like a "bubble" so I may have to work on the shadow and outline of the whole thing too. I meet with her again in the morning. And great to hear it's not slow for you! Appreciate the help.


Sheila Hoffman | Hoffman Graphics | Seattle

Share this post


Link to post
Share on other sites
Aires

Morning,  @sheilahoff 

 

.section-navbar .navbar .navline > .dropdown > .dropdown-menu:before {
display:none;
}
 
.section-navbar .navbar .navline > .dropdown > .dropdown-menu:after {
display:none;
}
 
The code above should remove the arrow above the dropdown menu
and adding a border-radius:1px; to the dropdown-menu class will make look less like a bubble
 
~Aires 
 

 


ndTgvai.jpg

Visit iheartpagelines.com for the latest tutorials on PageLines related products.

 

Share this post


Link to post
Share on other sites
sheilahoff

Good Morning Aires and thank you SO much. I meet with her in about an hour so I'll let you know what she thinks.

 

Do you also know about the Retina Display stuff? I tried it last night but after doing it realized that the instructions were for when I was using a background image and I'm no longer doing so. Here are the instructions I followed.

 

First, make an image that is twice the size as your current logo. A naming convention is to use @2x  in the name, so name your item: [email protected].

 

then use a media query like this:

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {

            #logo a{

                        background:url([pl_site_url]/wp-content/uploads/2014/08/ideal-life-logo-1352x.jpg) no-repeat;

 

                        background-size:135px 126px;

            }

}

 

SO I made the higher res image and assigned logo as custom styling classed then used this code. Looking at it now I'm wondering if I simply change the a and the background if it'd still work? I have NO idea what I'm doing! And I also have no way to test this as I don't have a MAC!

 

After searching on this forum I found an old thread I'd been on where Danny recommended this script http://imulus.github.io/retinajs/. I've installed it and have no way to know if it's working. If you (or anyone else) has a MAC or iPhone, please let me know if the logo looks crisp now! THANKS!


Sheila Hoffman | Hoffman Graphics | Seattle

Share this post


Link to post
Share on other sites
sheilahoff

UPDATE: She was pretty pleased overall. She wants the dropdowns to be centered under the primary instead of flush left. I can make the text centered but so far haven't found where to make the actual menu box move left so it's centered under the top. I tried to find where to do that in Inspect Elements to no avail. You seem so adept at this I'm guessing you'll know exactly what's needed! THANKS!

 

AND.... I realized that since the logo is no longer a background image all I had to do was use the higher res image instead and tell it the size to make it and HOPEFULLY now those with Retina will see it more clearly?!


Sheila Hoffman | Hoffman Graphics | Seattle

Share this post


Link to post
Share on other sites
Aires

Hi, sheilahoff in order to try and center you will need to adjust the left: 15%;  to a point where you think it looks centered.

 

So I would start at 1% and go from there.

 

hope this helps

 


ndTgvai.jpg

Visit iheartpagelines.com for the latest tutorials on PageLines related products.

 

Share this post


Link to post
Share on other sites
sheilahoff

Thanks...very helpful as usual. Now if I can figure out why I can't unlock templates...I'm going NUTS with things repeating. I know it's due to the templates but can't make them unlock! I opened a thread about it already.


Sheila Hoffman | Hoffman Graphics | Seattle

Share this post


Link to post
Share on other sites
Danny

Hi Sheila,

 

See my reply to your topic regarding templates not unlinking.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

  • Similar Content

    • Lisa Haran
      By Lisa Haran+
      Hi 
      I have a map here http://www.iloveoffset.com/maps/
      I want to add several pointer locations to the map, but when I do they do not appear.
      On this map there are 2 pointer locations and as you can there is only one visible.
      Earlier today I added 7 and could only see 4 so there is something odd going on.
      My theme is up to date
    • clj182
      By clj182+
      Hello,
      I've been having trouble unlocking the template section for past couple of weeks. When I try clicking nothing happens. 
      I've deleted my custom css and removed plugins. Im down to having only the following plugins:
      Akismet
      Contact Form 7
      DMS Professional Tools
      Pagelines Updater
      WooCommerce
      It was working fine before i have no idea what's going on with it.
    • flourishdesignstudio
      By flourishdesignstudio+
      My DMS 2 site http://www.heart-stone.com/ will not save any new custom css... I can still edit templates and publish those but any custom css that I enter never saves.
      All WP files, themes, and plugins are up to date. 
      Any thought about what might be causing this?
    • flourishdesignstudio
      By flourishdesignstudio+
      Is there a way to edit the custom CSS via FTP? I know I can edit the custom code in the Chrome editor but is there a file path I can use to find and edit the CSS directly from our FTP?
      Thanks in advance for the help!
    • nizami
      By nizami+
      Using navbar section with correctly configured WP menu to display main navigation at https://elenaangel.com. 
      All fine in desktop viewport. Menu displays twice in hamburger mode. How to fix this please? 

×