블로그 하단에 글쓰기 버튼과 관리 버튼 만들었다

티스토리는 원하는대로 꾸밀 수 있다고 하지만,

귀찮은 나는 그냥 스킨을 따랐다.

 

그나마 수정한 건 두 가지.

 

#1 글 보기에서 타이틀 높이 줄이기

관리-스킨 편집-CSS 에서

'article-header'라 된 부분에서

height를 반씩 줄였다.

이게 하나만 줄이면 적용되는 건 아닌 것 같아서,

찾아가면서 다 줄였다.

어찌 줄긴 했다.

그로 인해 뭔 부작용이 일어날지는 모르겠다.

html이나 css는 어릴 때 조금 건드려본 것 외에는

검색해서 이리저리 끼워맞추는 수준이라.

나름 html5 과제도 했었는데도 이런 처참한 수준.

 

#2 하단에 글쓰기, 설정 버튼 추가

내가 티스토리를 영 몰라서 그럴 수도 있다.

어딘가에 글쓰기나 설정 버튼을 넣을 수도 있다.

아직도 설정 메뉴들 보면 아득해졌다.

그런데 뭘 건드려도 어디에 추가하는지 모르겠다.

이제야 검색해보니 그냥 링크를 메인에 넣는 식이더라.

 

그래서 지금 블로그에는 하단에 div 하나 설정해서 그냥 넣었다.

 

(해당 코드는 더보기 클릭)

<div align="right">            

            <a href="https://idtptkd.tistory.com/manage/newpost" style="text-decoration:none">

            <img height="16px" width="16px" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjwhRE9DVFlQRSBzdmcgIFBVQkxJQyAnLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4nICAnaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkJz48c3ZnIGhlaWdodD0iMTY5Ni4xNDNweCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMTY5Ni4xNjIgMTY5Ni4xNDM7IiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxNjk2LjE2MiAxNjk2LjE0MyIgd2lkdGg9IjE2OTYuMTYycHgiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxnIGlkPSJwZW4iPjxwYXRoIGQ9Ik0xNjQ4LjAxNiwzMDUuMzY3TDEzOTAuNzk1LDQ4LjE0OUMxMzU5Ljc0NywxNy4wOTgsMTMxOC40NjYsMCwxMjc0LjU1NSwwYy00My45MDcsMC04NS4xODgsMTcuMDk4LTExNi4yMzYsNDguMTQ4ICAgTDgxLjU4NSwxMTI0Ljg2NmMtMTAuMjIsMTAuMjItMTYuODA4LDIzLjUxMS0xOC43NSwzNy44MzNMMC42MDEsMTYyMS4xODZjLTIuNzc0LDIwLjQ0OCw0LjE2MSw0MS4wMTUsMTguNzUzLDU1LjYwNSAgIGMxMi40NzMsMTIuNDczLDI5LjMxMywxOS4zNTIsNDYuNzE0LDE5LjM1MmMyLjk1MiwwLDUuOTIzLTAuMTk3LDguODkxLTAuNjAxbDQ1OC40ODgtNjIuMjMxICAgYzE0LjMyNC0xLjk0NSwyNy42MTUtOC41MjksMzcuODM1LTE4Ljc1MkwxNjQ4LjAxNiw1MzcuODQ0YzMxLjA0OS0zMS4wNDgsNDguMTQ2LTcyLjMzLDQ4LjE0Ni0xMTYuMjM3ICAgQzE2OTYuMTYyLDM3Ny42OTYsMTY3OS4wNjQsMzM2LjQxNSwxNjQ4LjAxNiwzMDUuMzY3eiBNNDkzLjU5OCwxNTA1LjM2NmwtMzUwLjM4MSw0Ny41NThsNDcuNTYtMzUwLjM3Nkw5NTMuNzgsNDM5LjU1NyAgIGwzMDIuODE4LDMwMi44MTlMNDkzLjU5OCwxNTA1LjM2NnogTTE1NTQuNTc1LDQ0NC40MDRsLTIwNC41MzYsMjA0LjUzM2wtMzAyLjgyMS0zMDIuODE4bDIwNC41MzUtMjA0LjUzMiAgIGM4LjIyLTguMjE4LDE3LjgxNC05LjQ0NiwyMi44MDItOS40NDZjNC45ODgsMCwxNC41ODIsMS4yMjgsMjIuODAzLDkuNDQ2bDI1Ny4yMjEsMjU3LjIxOGM4LjIxNyw4LjIxNyw5LjQ0MywxNy44MTIsOS40NDMsMjIuNzk5ICAgUzE1NjIuNzk1LDQzNi4xODYsMTU1NC41NzUsNDQ0LjQwNHoiLz48L2c+PGcgaWQ9IkxheWVyXzEiLz48L3N2Zz4="></img>

            </a>

             

            <a href="https://idtptkd.tistory.com/manage" style="text-decoration:none">

            <img height="16px" width="16px" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaWQ9IkxheWVyXzEiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI0IDI0OyIgdmVyc2lvbj0iMS4xIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxwYXRoIGQ9Ik0yMi4yNzksOS4xMThsLTEuNjUzLTAuMTkxYy0wLjEyLTAuMzU1LTAuMTU2LTAuNzA3LTAuMzI4LTEuMDU1bDEuMjQ0LTEuNDU5YzAuNjAxLTAuNzM3LDAuNTc0LTEuNzk5LTAuMDk4LTIuNDcxICBsLTEuMDI0LTEuMDM4Yy0wLjY3Mi0wLjY3My0xLjcyOC0wLjcyNy0yLjQ2NC0wLjEyNUwxNi41LDMuOTY4Yy0wLjMzNS0wLjE2Ni0wLjY4Ni0wLjMxMi0xLjA1My0wLjQzN2wtMC4xOS0xLjYyMyAgQzE1LjE2LDAuOTYzLDE0LjM3MiwwLjUsMTMuNDIyLDAuNWgtMS40NjhjLTAuOTUsMC0xLjc0LDAuNDYzLTEuODM2LDEuNDA5TDkuOTI3LDMuNjU2QzkuNTcyLDMuNzc1LDkuMjIsMy44NTksOC44NzIsNC4wMzEgIEw3LjQxMywyLjgxQzYuNjc3LDIuMjA5LDUuNjE0LDIuMjQ3LDQuOTQyLDIuOTJMMy45MDQsMy45NUMzLjIzMiw0LjYyMiwzLjE3OCw1LjY4LDMuNzc5LDYuNDE3bDEuMTg5LDEuNDU3ICBDNC44MDEsOC4yMDksNC42NTUsOC41NjEsNC41MzEsOC45MjhsLTIuMTIzLDAuMTlDMS40NjMsOS4yMTQsMC41LDEwLjAwMywwLjUsMTAuOTUzdjEuNDY4YzAsMC45NSwwLjk2MywxLjc0LDEuOTA5LDEuODM2ICBsMS45OTcsMC4xOTFjMC4xMiwwLjM1NSwwLjMyOCwwLjcwNywwLjUsMS4wNTVsLTEuMTU4LDEuNDU5Yy0wLjYwMSwwLjczNy0wLjUzMSwxLjc5OSwwLjE0MSwyLjQ3MWwxLjA0NiwxLjAzOCAgYzAuNjcyLDAuNjcyLDEuNzM4LDAuNzI2LDIuNDc1LDAuMTI1bDEuNDYtMS4xODljMC4zMzUsMC4xNjYsMC42ODksMC4zMTIsMS4wNTYsMC40MzdsMC4xOTEsMS45MzUgIGMwLjA5NiwwLjk0NSwwLjg4NiwxLjcyMSwxLjgzNiwxLjcyMWgxLjQ2OGMwLjk1LDAsMS43NC0wLjc3NiwxLjgzNi0xLjcyMWwwLjE5MS0xLjkwM2MwLjM1NS0wLjEyLDAuNzA3LTAuMjgxLDEuMDU1LTAuNDUzICBsMS40NTksMS4xODFjMC43MzYsMC42LDEuNzk5LDAuNTQ0LDIuNDcxLTAuMTI5bDEuMDM4LTEuMDRjMC42NzItMC42NzIsMC43MjYtMS43MzUsMC4xMjUtMi40NzJsLTEuMTg5LTEuNDU5ICBjMC4xNjYtMC4zMzUsMC4zMTItMC42ODgsMC40MzctMS4wNTVsMS40MzUtMC4xOTFjMC45NDUtMC4wOTYsMS4yMjEtMC44ODYsMS4yMjEtMS44MzZ2LTEuNDY4ICBDMjMuNSwxMC4wMDMsMjMuMjI0LDkuMjE0LDIyLjI3OSw5LjExOHogTTIyLjUsMTIuNDIyYzAsMC4zMTcsMC4wODUsMC41OC0wLjIzLDAuNjEybC0yLjExNiwwLjIzMiAgYy0wLjE5LDAuMDE5LTAuMjc5LDAuMTI3LTAuMzgsMC4yODljLTAuMDM1LDAuMDU2LTAuMDE5LDAuMTE2LTAuMDM0LDAuMTc5Yy0wLjE2MiwwLjU1NC0wLjM1NywxLjA3Mi0wLjYyMiwxLjU0MSAgYy0wLjEyNSwwLjIyLTAuMDkxLDAuNDk1LDAuMDY5LDAuNjkxbDEuNDUyLDEuNzc1YzAuMiwwLjI0NiwwLjE4NSwwLjYtMC4wMzksMC44MjRsLTEuMDM3LDEuMDM4ICBjLTAuMjI0LDAuMjI0LTAuNTc4LDAuMjQyLTAuODIzLDAuMDQybC0xLjc3NC0xLjQ0N2MtMC4xNTMtMC4xMjYtMC4zNTgtMC4xNjctMC41NDktMC4xMTZjLTAuMDU3LDAuMDE1LTAuMTExLDAuMDM5LTAuMTYxLDAuMDY5ICBjLTAuNTA2LDAuMjc3LTEuMDI0LDAuNDktMS41NDIsMC42MzRjLTAuMjQ0LDAuMDY4LTAuNDIxLDAuMjc4LTAuNDQ3LDAuNTNsLTAuMjMyLDIuNDU1Yy0wLjAzMiwwLjMxNS0wLjI5NSwwLjczMS0wLjYxMiwwLjczMSAgaC0xLjQ2OGMtMC4zMTcsMC0wLjU4LTAuNDE1LTAuNjEyLTAuNzNsLTAuMjMyLTIuMzY2Yy0wLjAxOS0wLjE5LTAuMTI3LTAuNDA0LTAuMjg5LTAuNTA1Yy0wLjA1Ni0wLjAzNS0wLjExNi0wLjA4Mi0wLjE3OS0wLjA5NyAgYy0wLjU1NC0wLjE2Mi0xLjA3Mi0wLjM4OS0xLjU0MS0wLjY1M2MtMC4yMi0wLjEyNS0wLjQ5NS0wLjEwNy0wLjY5MSwwLjA1M2wtMS43NzUsMS40NDRjLTAuMjQ2LDAuMjAxLTAuNiwwLjE4MS0wLjgyNC0wLjA0MyAgbC0xLjAzOC0xLjAzOWMtMC4yMjQtMC4yMjQtMC4yNDItMC41NzktMC4wNDItMC44MjRsMS40NDctMS43NzVjMC4xMjUtMC4xNTMsMC4xNjgtMC4zNTgsMC4xMTYtMC41NSAgYy0wLjAxNS0wLjA1Ny0wLjAzOS0wLjExMS0wLjA2OS0wLjE2MWMtMC4yNzctMC41MDYtMC40OS0xLjAyNC0wLjYzNC0xLjU0MmMtMC4wNjgtMC4yNDQtMC4yNzgtMC40MjEtMC41My0wLjQ0N2wtMi42NDItMC4yMzIgIEMyLjEwMywxMy4wMDIsMS41LDEyLjczOCwxLjUsMTIuNDIydi0xLjQ2OGMwLTAuMzE3LDAuNjAzLTAuNTgsMC45MTgtMC42MTJsMi40Ni0wLjIzMmMwLjE5LTAuMDE5LDAuNDUxLTAuMTI2LDAuNTUyLTAuMjg3ICBjMC4wMzgtMC4wNjEsMC4xMS0wLjEyNiwwLjEyNC0wLjE5NWMwLjE2MS0wLjU0OCwwLjM5OS0xLjA2MSwwLjY2MS0xLjUyNmMwLjEyNS0wLjIyLDAuMTEzLTAuNDk1LTAuMDQ3LTAuNjkxTDQuNzI3LDUuNjM2ICBjLTAuMi0wLjI0Ni0wLjE3OS0wLjYsMC4wNDUtMC44MjRsMS4wMzktMS4wMzhDNi4wMzUsMy41NSw2LjM4OSwzLjUzMiw2LjYzNSwzLjczMkw4LjQxLDUuMTc5YzAuMTU0LDAuMTI2LDAuMzU5LDAuMTY4LDAuNTUsMC4xMTYgIGMwLjA1Ny0wLjAxNSwwLjExMS0wLjAzOSwwLjE2MS0wLjA2OWMwLjUwNi0wLjI3NywxLjAyNC0wLjQ5LDEuNTQyLTAuNjM0YzAuMjQ0LTAuMDY4LDAuNDIxLTAuMjc4LDAuNDQ3LTAuNTNsMC4yMzItMi4xNDIgIEMxMS4zNzMsMS42MDMsMTEuNjM3LDEuNSwxMS45NTMsMS41aDEuNDY4YzAuMzE3LDAsMC41OCwwLjEwMywwLjYxMiwwLjQxOGwwLjIzMiwyLjIxYzAuMDE5LDAuMTksMC4xMjcsMC4zMjYsMC4yODksMC40MjYgIGMwLjA1NiwwLjAzNSwwLjExNiwwLjA0MywwLjE3OSwwLjA1OGMwLjU1NCwwLjE2MiwxLjA3MiwwLjM2OSwxLjU0MSwwLjYzNGMwLjIyLDAuMTI1LDAuNDk0LDAuMDk3LDAuNjkxLTAuMDYzbDEuNzc1LTEuNDQ5ICBjMC4yNDYtMC4yLDAuNi0wLjE4MywwLjgyNCwwLjA0MWwxLjAzOCwxLjAzOGMwLjIyNCwwLjIyNCwwLjI0MiwwLjU3OCwwLjA0MiwwLjgyNGwtMS40NDcsMS43NzQgIGMtMC4xMjUsMC4xNTMtMC4xNjgsMC4zNTgtMC4xMTYsMC41NWMwLjAxNSwwLjA1NywwLjAzOSwwLjExMSwwLjA2OSwwLjE2MWMwLjI3NywwLjUwNiwwLjQ5LDEuMDI0LDAuNjM0LDEuNTQyICBjMC4wNjgsMC4yNDQsMC4yNzgsMC40MjEsMC41MywwLjQ0N2wxLjk1NSwwLjIzMmMwLjMxNSwwLjAzMiwwLjIzMSwwLjI5NSwwLjIzMSwwLjYxMlYxMi40MjJ6Ii8+PHBhdGggZD0iTTEyLjY4OCw3LjM4MmMtMi4zNzQsMC00LjMwNiwxLjkzMi00LjMwNiw0LjMwNnMxLjkzMiw0LjMwNiw0LjMwNiw0LjMwNnM0LjMwNi0xLjkzMiw0LjMwNi00LjMwNiAgUzE1LjA2Miw3LjM4MiwxMi42ODgsNy4zODJ6IE0xMi42ODgsMTQuNzYzYy0xLjY5NiwwLTMuMDc2LTEuMzgtMy4wNzYtMy4wNzZzMS4zOC0zLjA3NiwzLjA3Ni0zLjA3NnMzLjA3NiwxLjM4LDMuMDc2LDMuMDc2ICBTMTQuMzgzLDE0Ljc2MywxMi42ODgsMTQuNzYzeiIvPjwvc3ZnPg=="></img>

            </a>

          </div>

 

 

 

뭐가 이렇게 길어 하겠지만, 저게 다 이미지를 base64로 넣어서 그렇다.

이미지는 https://www.iconfinder.com/ 아이콘파인더에서 찾았다.

 

결과는 우측 하단에 쬐까낳게 추가되었다

스킨 편집의 미리보기 화면

모바일에서도 나오는 것처럼 미리보기는 되어있지만,

정작...

내 핸드폰으로 들어가서 모바일로 보면 나오지 않는다.

모바일은 자체 앱을 쓰라는 배려 아닌 배려인가.

 

모바일의 구독하기나 방명록 버튼도 없애버리고 싶은데...

이건 조금 찾아봐야겠다.

 

결론은... 왜 없나 싶으면 검색할 걸 그랬다.

그냥 html 코드 만지작 거렸다.

이래서 어설프게 알면 어설프게 삽질을 하며 시간을 보낸다.

근데 그것도 나쁘진 않다.

어설프지만 스스로 헤매서 알면, 쉽게 안 잊어버리니까.