This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Theme update install

  • Creator
    Topic
  • #10216
    khits
    Participant

    Do we need to uninstall the previous version of this theme in order to install the new version? I tried installing via WP dashboard and get this message Destination folder already exists. /home4/kenhitsm/public_html/mswc/wp-content/themes/alyeska/

    Theme install failed.

    Need to know what to do to get it going . Thanks.

Viewing 15 replies - 16 through 30 (of 30 total)
  • Author
    Replies
  • #11362
    khits
    Participant

    Hey Jason,
    It’s not that I don’t like the new style sheets. It’s that they change what I had previous and to me what was a nicer overall spacing on those slider images. It’s such a drastic difference on my end for something that wasn’t broken before.
    The fact that there is now an option for the mobile nav display is awesome. I didn’t even know that had been added. Is there a list of upgrades somewhere I could look at? Thanks.

    #11364
    Jason Bobich
    Keymaster

    Did you get a chance to checkout the changelog? That’s where I keep that kind of information. There was so much that happened in v3.0, that section is a bit more summarized than normal.

    http://themeblvd.com/changelog?theme=alyeska

    #11369
    khits
    Participant

    Thanks, didn’t see that before. Heck of alot of changes.
    I’m no pro at this yet. How do I go about changing the css for the specific viewport sizes. I can see it obviously has to do with the @media (max-width: 767px). Would I just add my settings to the style.ccss file? I know I need to change the font size and line spacing for that size. Can you give me an example of the code. Thanks.

    #11373
    khits
    Participant

    OK, so after more inspecting I think I’m understanding what needs to be done. It looks like I have to edit the responsive.min.css file. Is this the case? because that file is a mess to find items in (lol) Is there not a way to have some sort of custom file for that like our custom css file? If not, am I correct in adding a line-height rule in addition to changing the font-size for the rule that is affecting my slide title area? Thanks.
    K.

    #11382
    Jason Bobich
    Keymaster

    You shouldn’t be editing any files of the theme. All CSS changes will come from your child theme.

    Let’s say there’s some item you want to change. It has a class “my-thing” and it’s styled in theme.css like this:

    .my-thing {
    	font-size: 14px;
    }

    And then in the proceeding responsive.css it’s styled like this for tablet and mobile:

    /* Tablets */
    @media (max-width: 979px) {
    	.my-thing {
    		font-size: 13px;
    	}
    }
    
    /* Mobile */
    @media (max-width: 767px) {
    	.my-thing {
    		font-size: 12px;
    	}
    }

    Then, in your child theme’s style.css, which comes after all of the theme’s stylesheets, you do this to override:

    .my-thing {
    	font-size: 16px;
    }

    Well, now what you’ve done is you overridden everything before in the theme. So now “my-thing” will be 16px everywhere — desktop, tablet, and mobile. — If this isn’t what you want, then you need to add to what you’re doing.

    What do you do about that? — When you make your CSS customizations, you need to account for the different viewport sizes the same way theme was doing before you altered it. So, in your child theme’s style.css you need to follow the same pattern and style your customization for the three viewports:

    /* Desktop */
    .my-thing {
    	font-size: 16px;
    }
    
    /* Tablets */
    @media (max-width: 979px) {
    	.my-thing {
    		font-size: 15px;
    	}
    }
    
    /* Mobile */
    @media (max-width: 767px) {
    	.my-thing {
    		font-size: 14px;
    	}
    }
    #11387
    khits
    Participant

    Ok, that’s what I initially tried last night because that’s how I figured it should be. Thing is it didn’t change anything when I did that. Let me try again and see what is going on. Thanks so much for your help. You really can’t beat the support here.
    K.

    #11390
    Jason Bobich
    Keymaster

    Yeah, I’d take another look. If that’s not working, then there’s probably something else wrong with what you’re doing outside of this concept. — Like maybe you’re using an incorrect selector, or even possibly there’s some typo up above that breaks everything moving down, like a missing bracket or something.

    #11391
    khits
    Participant

    So, I see that I didn’t have the dbl brackets so it was a syntax error last night. Font size is working, but for some reason no matter what I put in for line height for that rule it is not affecting anything. That’s the main problem.

    here’s what I coded:

    @media(max-width: 767px){
    #featured .standard-slider .media-align-right .slide-title span, #featured .standard-slider .media-align-left .slide-title span, #content .standard-slider .media-align-right .slide-title span, #content .standard-slider .media-align-left .slide-title span, #featured_below .standard-slider .media-align-right .slide-title span, #featured_below .standard-slider .media-align-left .slide-title span {
    font-size: 12px;
    line-height: 1.5em;
      }
       }

    any idea why it won’t accept the line height?

    #11393
    Jason Bobich
    Keymaster

    Can I see a live link to this?

    #11395
    khits
    Participant

    Here ya go http://www.mswc.hitsmandesign.com

    I think I narrowed it down to

    .standard-slider .media-align-left .slide-title, .standard-slider .media-align-right .slide-title, That’s seems to be the classes I need to adjust. I tried to do the @media for those but it wouldn’t take for whatever reason. I commented out the above code and inserted those classes to no avail. It is now back to as above.

    K

    #11400
    Jason Bobich
    Keymaster

    I would try to get more organized with how you’re writing out these styles. The way you’re doing this is sort of getting sort of sloppy and is just going to be hard for you to follow the logic of what you’re writing. If you’re trying to do all of this in your WordPress editor, this is a great plugin you can use to turn your WordPress editor into more of a an actual code editor, so you can space and indent properly, and see things with syntax highlighting.

    http://wordpress.org/plugins/wp-editor/

    I would start by deleting all of this:

    .standard-slider .media-align-left .slide-title, 
    .standard-slider .media-align-right .slide-title {
        font-size: 1.6rem; 
        line-height: 1.625;
    }
    
    .full-image .slide-title span {
         font-size: 1.5em;
      }
    
    @media (max-width: 979px){
      .standard-slider .media-align-left .content-inner, .standard-slider .media-align-right .content-inner {
        padding:0px 5px;
        }
          }
    
    
    @media(max-width: 767px){
    #featured .standard-slider .media-align-right .slide-title span, #featured .standard-slider .media-align-left .slide-title span, #content .standard-slider .media-align-right .slide-title span, #content .standard-slider .media-align-left .slide-title span, #featured_below .standard-slider .media-align-right .slide-title span, #featured_below .standard-slider .media-align-left .slide-title span{
         font-size: 12px;
         line-height: 1.5em;
             }
              }

    And get things going with a more organized, consistent starting point:

    .standard-slider .media-align-left .slide-title, 
    .standard-slider .media-align-right .slide-title {
    	line-height: ;
    }
    #featured .standard-slider .media-align-right .slide-title span, 
    #featured .standard-slider .media-align-left .slide-title span {
    	font-size: ;
    }
    @media (max-width: 979px){
    	.standard-slider .media-align-left .slide-title, 
    	.standard-slider .media-align-right .slide-title {
    		line-height: ;
    	}
    	#featured .standard-slider .media-align-right .slide-title span, 
    	#featured .standard-slider .media-align-left .slide-title span {
    		font-size: ;
    	}
    }
    @media (max-width: 767px){
    	.standard-slider .media-align-left .slide-title, 
    	.standard-slider .media-align-right .slide-title {
    		line-height: ;
    	}
    	#featured .standard-slider .media-align-right .slide-title span, 
    	#featured .standard-slider .media-align-left .slide-title span {
    		font-size: ;
    	}
    }

    And to keep things easier and to the point, use px values for all of your line heights and font sizes.

    #11411
    khits
    Participant

    Jason, I can’t thank you enough. Everything is displaying as I want and I have a much better understanding of the code.I knew that mixing em and px wasn’t good practice, but I was using info from the old theme which was px and the new theme is mostly em or rem. I assume I could use just all em instead? I’m really gonna try and practice my css coding more. It’s one of those things that if ya don’t consistently do it it won’t make sense or be retained. Again thank you so much! I’ve learned alot from this and I know that’s not you’re job.

    K.

    #11420
    Jason Bobich
    Keymaster

    The thing with using em’s is that you then have to take in aspects from other items in the CSS. In this case, this gets complicated because there are so many styles going on with the theme.

    First, you’ll want to make sure you understand what the difference is between all of them. An em is equal to the amount of px set on an item.

    So, say you had —

    .whatever {
       font-size: 12px;
       line-height: 1em;
    }

    Then the line-height is equal to 12px. Where this get complicated is if .whatever didn’t contain a font-size that you can see. Maybe you don’t know what its inherited font size is, and thus you don’t know what 1em is equal to. Using px is just an absolute way to know what you’re putting in without having to account for other factors outside of your control.

    And then, just FYI, when you use rem’s it’s a measurement of the top-level HTML font. This is sort of a newer trend because it’s easier to keep track of because there can only be one top-level font-size.

    So if the theme had —

    html,
    body {
       font-size: 12px;
    }

    Every where you use 1rem, it’s always equal to 12px, 2rem = 24px, etc.

    #11426
    khits
    Participant

    Thanx Jason, I had a basic understanding of em, but not of rem. You’re explanations are really informative. Have you or have you ever thought of writing a CSS book? I’ve seen quite a few, but I really get your examples.

    K.

    #11435
    Jason Bobich
    Keymaster

    Ha, when I would ever find the time for that, I don’t know!

Viewing 15 replies - 16 through 30 (of 30 total)
  • The forum ‘Alyeska Responsive WordPress Theme’ is closed to new topics and replies.