How can I adjust my grid template after I put grid-area in CSS?

Question

After I learned CSS Grid Area, I'm confused, what should I do if I'm going to change size for my grid can after I put grid-area? what I should most concern is a rows or columns

Code:

.container {
    width: 80%;
    margin: 50px auto;
    display: grid;
    grid-template-columns: 1fr 2fr 2.5fr;
    grid-template-rows: 100px 200px 60px;
    grid-template-areas: 'header header header'
                         'sidebar nav content'
                         'sidebar nav content'
                         'footer footer footer';
}

Output:

Note: My english is not really good but I need help. I'm trying to change my grid-size-template after I put grid-area. I expect to understand about this thing.