About Me Page

TLPhotoWorks

Hi all,
I'm revamping my site and I want to add an About Me page. I get how to add the page in the header, but I want to have a clean about me page with a couple of paragraphs and and flushed picture. Pretty simple.

I did do a search on the forum, but I get mostly hits about "Page", not about how to set up an About Me Page.

Thanks!

denisegoldberg

@TLPhotoWorks said:
...I want to have a clean about me page with a couple of paragraphs and and flushed picture. Pretty simple.

Create a page, then drag in a text (or HTML) element and a photo element.

See help page Create custom pages.

TLPhotoWorks

Thanks @denisegoldberg . I found a Youtube video that help me know what to look for.
Now, I need to insert columns. Know any good html sites for basic designers like me? Thanks

Hikin' Mike

@TLPhotoWorks said:
Thanks @denisegoldberg . I found a Youtube video that help me know what to look for.
Now, I need to insert columns. Know any good html sites for basic designers like me? Thanks

Not sure how many columns you need, but this is a three-column "template". Use a HTML/CSS block. Add this to the HTML section:

<div class="column-wrap">

    <div class="column">
        <ul>
        <h2>Column One</h2>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
        </ul>   
    </div>

    <div class="column">
        <ul>
        <h2>Column Two</h2>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
        </ul>   
    </div>

    <div class="column">
        <ul>
        <h2>Column Three</h2>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
            <li><a href="Link-Here">Text Here</a></li>
        </ul>   
    </div>  

</div>

Add this to the CSS:

/* Column Wrap */
.column-wrap {
    text-align: center;
    color: #;
    }
.column-wrap h2 {
    color: #;
    }   
.column-wrap a {}
.column-wrap a:hover {} 

    /* Column Container */
.column {
    width: 32%;
    display: inline-block;
    float: left;    
    text-align: center;
    }   
.column ul {
    list-style: none;
    }   
.column:nth-child(1) {
    float: left;
    }
.column:nth-child(2) {
    margin: 0 1.25%;
    float: none;
    }
.column:nth-child(3) {
    float: right;
    }   

@media only screen and (max-width: 799px) {
    .column,
    .column:nth-child(1),
    .column:nth-child(2),
    .column:nth-child(3) {
        width: 100%;
        clear: both;
        margin: 0 auto;
        }
}

TLPhotoWorks

Thanks @"Hikin' Mike"

I'll give it a try!