Post List

레이블이 블로그인 게시물을 표시합니다. 모든 게시물 표시
레이블이 블로그인 게시물을 표시합니다. 모든 게시물 표시

티스토리 블로그, fastboot 스킨 사이드바 넓이(폭) 변경하는 방법



티스토리 블로그, fastboot 스킨 사이드바 넓이(폭) 변경하는 방법


사이드바의 폭을 변경하는 방법은 꼭 fastboot 스킨이 아니어도 다른 스킨을 사용하더라도 수정 방식이 동일한 것으로 알고는 있는데 fastboot 스킨 외엔 따로 폭을 조정할 필요성을 느끼지 못해 시도를 해보진 않았답니다.




두장의 사진을 비교해 보면 사이드바의 폭이 서로 다른 것을 확인 할 수 있는데요. 무엇을 변경하면 저렇게 사이드 바의 폭을 변경할 수 있는지 폭을 변경하는 방법에 대해 알아보도록 하겠습니다.






블로그관리로 이동하셔서 Html/Css 편집창을 열어주세요. 잘보고 따라하시면 전혀 어렵지 않게 변경 하실 수 있습니다.




Html 편집창에서 Ctrl+F (검색)를 이용해서 col-md를 검색하면 위 사진과 같은 문구를 찾으실 수 있습니다. 스킨마다 조금씩 다르긴 하지만 대부분이 이렇게 "col-md-8", "col-md-4"로 되어 있답니다. 8+4로 합이 12가 됩니다.

여기서 8은 본문의 넓이이고 4는 사이드바의 넓이를 나타냅니다. 이 수치를 변경시키면 본문의 폭과 사이드바의 폭이 변경이 되는데 이때 유의해야 할 점은 변경한 두 숫자의 합이 12가 되야 한다는 겁니다.






(Ex : 본문7+사이드바5/ 본문9+사이드바3)




기존에 "col-md-8"이던 본문을 "col-md-9"로 크게 키우고 사이드바를 "col-md-4"에서 "col-md-3"으로 작게 만들어봤습니다. 그 결과값이 본 글의 처음에 올린 비교 사진에서 사이드바 변경 후의 값이랍니다.

치수 변경 전에 비해 본문은 넓어지고 사이드바가 줄어든 것을 확인 할 수 있습니다. 약간의 숫자를 변경해 글쓴이가 원하는 치수에 맞게 본문과 사이드바의 치수를 변경해서 사용하시면 됩니다. 


티스토리 fastboot 스킨 적용 후 화면에 사이드바 만들기



티스토리 fastboot 스킨 적용 후 화면에 사이드바 만들기


티스토리 최적화 스킨으로 알려진 Fastboot스킨을 적용하고 나면 가장 먼저 의아한 것이 바로 사이드바가 없다는 겁니다. 사이드바의 필요성이 없는 분이라면 상관이 없겠지만 대부분의 블로거들은 사이드바를 애용하리라 생각됩니다. 그렇다면 Fastboot 스킨에서는 사이드바를 사용할 수 없을까요?



Fastboot V1.6.2를 적용한 후 첫 화면입니다. 상단에는 최신글이 하단에는 최신글 순서대로 글별 메인사진이 나열되어 있는에 우측 혹은 좌측에 있어야 할 사이드바가 없는 것을 확인 할 수 있답니다.






아래 글을 따라오시면 쉽게 사이드바를 생성 할 수 있으니 걱정하지 마시고 따라해 주세요.




블로그관리에서 Html/ Css 편집창을 열어줍니다. Ctrl+f (검색)를 통해 document를 검색하면 document.write라는 문구로 시작되는 명령어를 찾을 수 있는데 사진의 사각부분을 수정해 주면 됩니다.


document.write('<스타일>#leftContent{display:none;}#coverDiv{float:left;width:75%;margin-top:-15px;}@media screen and (max-width: 991px){#coverDiv{width:100%;margin-top:0}}#coverDiv{min-height:100%;margin-bottom:50px;display:block;}#coverDiv img{float:right; padding-left:10px; max-width:100%}#coverDiv .info p{margin-bottom:50px;}#coverDiv .col-md-12,#coverDiv .col-md-6{padding:10px}#coverDiv .col-md-3 img{float:none;display:block;margin:auto;padding:0;}#coverDiv .col-md-12 img{max-height:200px;}#coverDiv .col-md-6 img{max-height:150px;}#coverDiv p.des{font-size:12px;}#coverDiv .col-md-12 img{float:left;padding-left:0;padding-right:10px;}#coverDiv div.thumbImages{margin:30px 10px;height:185px;overflow:hidden;text-align:center;}#coverDiv div.thumbImages img{padding:0;margin:5px;float:none;}#coverDiv h5{margin-bottom:5px;}#coverDiv .pubDate{float:right;font-weight:bold;}#coverDiv .loading{height:1080px;}#coverDiv img{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";filter:alpha(opacity=80);-moz-opacity:0.8;opacity:0.8;}#coverDiv img:hover{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);-moz-opacity:1;opacity:1;}#outer_btn_left,#outer_btn_right{display:none !important;}@media screen and (max-width: 767px) {#coverDiv .col-md-12 p.des, #coverDiv .col-md-6 p.des{display:none}#coverDiv .col-md-12 img, #coverDiv .col-md-6 img{padding:0;width:100%;height:auto;max-height:none;}}.contentPadding{background-color:#ffffff;padding:10px;margin:5px;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);box-shadow: 0 1px 2px rgba(0, 0, 0, .2);}
')








위 내용을 마우스로 드래그한 다음 복사/ 붙이기 하시면 됩니다. 단, 소스를 임의로 변경해 놨습니다. 그렇지 않으면 HTML로 인식을해서 표시가 안되서 수정을 했네요.

블로그에 붙여 넣기 하실때에는 첫줄의 스타일을 style로 변경해 주시면 됩니다.




내용을 변경한 후 저장하고 블로그를 열어보면 혹은 새로고침을 해보면 이렇게 우측에 없던 사이드바가 생성된 것을 확인 할 수 있습니다. 이후 사이드바의 순서 변경이나 추가/삭제는 블로그관리의 꾸미기 → 사이드바에서 변경 가능합니다.



[티스토리 블로그] fastboot(페스트붓) 스킨에서 블로그명(이름)을 눌러도 홈 메인화면으로 바로가기가 안될때


 [티스토리 블로그] fastboot(페스트붓) 스킨에서 블로그명(이름)을 눌러도 홈 메인화면으로 바로가기가 안될때
  
* 티스토리 블로그가 저품질로 인해 나락으로 떨어져서 구글블로그로 이전중입니다. 그로인해 배경이 되는 블로그 화면이 지금과 달라도 이해해주세요.

보통은 블로그의 대문에 있는 자신의 블로그 이름을 마우스로 클릭하면 블로그의 메인 홈으로 이동을 합니다. 블로그 내에 있는 어떤 글을 읽다가도 첫 화면으로 돌아가고 싶을때는 블로그 상단에 있는 블로그명을 쿨큭릭하면 되는데요. 


 최적화 스킨인 Fastboot 스킨을 적용하고 나면 최초에 아무리 대문의 상단에 있는 블로그명을 클릭해도 아무런 반응이 없습니다. 링크가 되어 있다면 일반적으로 마우스를 가져다 대면 화살표에서 손가락 표시로 가뀌어야 하는데 마우스 포이트에는 아무런 움직임이 없죠..






필요가 없는 분들도 있겠지만 반대로 필요한 분들도 있겠죠? 잘 따라 오시면 여러분들도 블로그명을 클릭시 홈으로 이동하실 수 있습니다. 

블로그 관리에서 Html/ Css 편집창을 열어주세요.
  
  
Html에서 Ctrl+f (검색)을 이용하여 사각형 속의 내용을 찾습니다. 사각형 속의 내용은 <h3>[##_title_##]</h3>입니다.

 

조금 전 찾은 타이틀 문구에서 자신의 블로그 주소를 사진 처럼 추가해 줍니다.






기존의 <h3>[##_title_##]</h3>에서 <h3><a href="블로그 주소">[##_title_##]</h3>로 변경을 하면 됩니다.
  

변경된 내용을 저장하고 나니 그냥 문자로만 인식했던 블로그명 타이틀이 색상도 변경이 되었고 링크로 인식이 되어 마우스를 가져다 대면 손가락 아이콘으로 변경되는 것을 확인 할 수 있습니다. 이제 블로그 안의 그 어디에 있던 상단에 있는 블로그명 타이틀을 클릭하면 블로그의 첫 화면으로 이동을 하게 됩니다.



티스토리 블로그 최적화 스킨 - fastboot 설치방법

 티스토리 블로그 최적화 스킨 - fastboot 설치방법
메인 사진을 뭘로 할까 고민하다 넣은게 휴대폰 안드로이드 Fastboot 사진이라니... 블로그 스킨 이름과 동일하니 ㅎㅎ
 기존에 사용 하던 스킨이 깔끔했는데 휴대폰과의 연동을 풀어버리니 휴대폰에서 볼때 메인화면이 짤리고 깔끔하게 나오지 않아서 찾아보던 중 티스토리 블로그의 가독성과 최적화가 잘 되어 있는 스킨으로 "Fastboot"라는 이름의 스킨을 추천을 해주시길래 설치를 해봤습니다.

Fastboot 스킨다운


FastBoot v1.6.2.zip
위 파일을 다운 받으시면 되며 파일 버전은 v1.6.2입니다.
Fastboot는 "Readiz"님께서 만드신 반응형스킨으로 모바일, pc 어느 기기로 접속을 해도 기기에 맞춰 블로그를 최적화 시켜줍니다. Readiz님의 블로그를 방문하시면 V1.6/ V1.6.1/ V1.6.2를 받으실 수 있고 위에 v1.6.2를 올려뒀으니 이 버전을 쓰실 분은 여기서 받으시면 됩니다. 참고로 현재 제 블로그가 Fastboot V1.6.2버전을 이용한 스킨입니다.








무료배포인 대신 제작자분께서 알리는 글을 올려둔 것이 있습니다.
<이 스킨을 만든 목적이 모바일 지원이 좋지 않는 티스토리에 널리 퍼져나가서 티스토리가 더욱 Asesome 한 서비스가 되도록 하는 것이며 검색엔진 순위에서 티스토리가 네이버 블로그 등에 밀리고 있는데 이를 계기로 티스토리가 1등 블로그가 되었으면 하는 마음으로 제작 중인 스킨이라고 합니다. 그리고 다른 접속자가 이 스킨을 어디에서 받을 수 있는지 명기하셔야 합니다.>

Fastboot 스킨 설치하기




위에서 V1.6.2를 다운 받아 압축을 푸시면 이렇게 1개의 폴더와 6개의 파일이 나옵니다. 이 파일들을 블로그 스킨에 등록시킨 후 적용을 해야 하는데 아래 내용을 차근 차근 따라 오시면 쉽게 적용 할 수 있습니다.

블로그 관리에서 꾸미기 → 스킨변경을 선택합니다.
다운 받은 스킨을 먼저 등록해야 하므로 스킨등록을 클릭합니다.








파일을 업로드 하는 창이 뜨는데 우측 상단의 추가를 통해 위 압축 파일에서 (1)의 6개 파일을 드래그로 넣고 (2)의 폴더를 열어 그 안에 있는 파일들도 함께 드래그로 넣어 한꺼번에 업로드 합니다.

이름을 지정해서 저장한 후 스킨보관함에 보면 이렇게 저장한 Fastboot v1.6.2의 목록이 있으니 ...을 눌러 적용을 시켜주세요.


짜잔!! 적용에 필요한 몇초가 지나면 이렇게 새로운 스킨으로 변경되어 있습니다.
초반에는 최근글을 중심으로 메인화면이 잡혀 있고 사이드바도 없습니다. 하나하나 설정하는 방법에 대해 이 후 포스팅때 알아보도록 하겠습니다.


티스토리 (Tistory) 에서 구글블로그(Blogger)로 이전을 해볼까?? 티스토리 백업 방법



티스토리(Tistory)에서 구글블로그(Blogger)로 이전을 해볼까?? 티스토리 백업방법


티스토리 (Tistory) 블로그와 다음 (Daum) 검색


요즘 티스토리 블로그를 운영하시는 분이라면 저같은 생각을 참 많이 하실듯 합니다. 
다음에서는 버린 자식이고 네이버에서는 다른집 자식이라 아무도 챙겨주지도 않는 티스토리 블로그
작년 연말 다음과 네이버의 무분별한 칼침에 저를 포함한 수많은 블로거들이 검색 노출이 되지 않는 일명 저품질 쇼크를 먹었는데 겨우 다시 회복세로 돌아선다 싶으니 이젠 네이버의 로직 변경 등 자기네 새끼들을 챙겨주느라 네이버 블로그를 제외한 다른 플랫폼의 블로그는 검색시 블로그 게시판이 아닌 웹사이트 게시판으로 이동하게 되었습니다.
솔직히 그런 네이버의 행태가 밉긴 하지만 지 새끼들 지가 챙기겠다는데 할말은 딱히 없습니다. 다음 카카오라는 어미 노릇 못하는 찌질이를 노려볼 뿐이지..
티스토리의 목적은 99%가 구글 애드센스를 이용한 수익이 목적이 될텐데 이렇듯 유입자가 줄어들게 된다면 큰 차질이 생기게 됩니다. 또한 카카오 측에서는 아니라고 하지만 방목되고 있는 티스토리 블로그의 앞날이 풍전등화 처럼 아슬아슬하기 그지 없습니다. 최근 티스토리 가입을 위한 초대장을 없애고 모든 이들에게 오픈한다고 발표했지만 그걸 보면서 느낀건 "그딴거 하지말고 검색 노출에 대한 거나 신경을 쓰지, 네이버가 지네 블로그한테 하는거에 반만 해봐라"라는 겁니다.
티스토리 블로그를 시작한지 이제 2년이 다되어 가는데 수익은 기어가는 수준으로 하락을 했고 다음에서 조차 검색은 안드로메다행입니다. 지들은 저품질이 아니라고 하지만 꼭 검색이 누락되는 것만이 저품질이라고 볼수는 없죠. 거의 제목을 그대로 쳐야만 검색이 되는 검색이 뒤로 밀리는 저품질 또한 있으니..







저 같은 경우에는 정보성 블로그 3개와 일상용 블로그 1개, 총 4개를 운영하다 1개는 폐쇄했고 또 한개는 이제 글을 안쓰고 있네요. 보내려고 하고 있습니다. 결국 남은건 지금 쓰는 정보성 블로그 1개와 직접 보고 촬영해서 보정해서 올리는 일상용 블로그 하나 남았는데 이놈의 다음은 각 블로그 별로 저품질을 먹이는 것이 아니라 계정을 통으로 먹이는 것으로 보이네요. 정보성 블로그야 남들과 비슷한 것들이 많으니 유사문서등에 취약하지만 내가 직접 보고 찍고 보정하고 올린 사진으로 된 일상용 블로그까지 함께 검색이 밀리는거 보면 거의 확실해 보입니다. 결국 지금 계정에 더 블로그를 추가해봐야 이미 찍힌 계정이라 더 이상 하나 마나입니다.


구글 블로그 (Blogger) 이전 가능성 및 티스토리 XML백업 방법


그렇다면 생각해 볼 수 있는 방법은 크게 2가지 입니다. 
☞ 새로운 주민번호를 이용해 새계정을 파고 애드센스가 날라간게 아니니 새로운 계정에 기존 애드센스를 연동해 사용하는 방법
☞ 티스토리를 접고 워드프레스나 구글 블로거로 이전
하지만 2가지 방법 모두 큰 문제점이 있습니다. 바로 다시 시작을 해야 한다는 건데요. 티스토리에서는 기존에 백업/ 복원을 이용할 수 있게 해줬지만 저품질 블로그들이 새로 블로그 파서 기존 내용 그대로 옮긴다고 폐쇄를 시켜버렸죠. 그래서 전체 이전이 되지 않습니다. 워드프레스나 구글 블로거는 XML 파일을 이용해 백업/ 복원이 가능하니 티스토리 블로그의 내용을 XML로 저장만 할 수 있으면 되는데..
그렇다고 100% 안될까요? 당연히 아니죠.. 그거 때문에 몇날 며칠을 짬날때 마다 검색에 시간을 투자했는데 일단 파이썬(Python)이라는 프로그램을 이용해 티스토리를 XML 파일로 백업 할 수 있다고 합니다.
재능 기부라고 홍보를 하는 크몽을 통해 금액대가 5만원이 넘지 않는 몇몇 분에게 문의를 했지만 모두들 자기의 분야와는 달라 해줄 수 없다는 답변을 받았네요. 구글을 이용해 찾아보면 파이썬(Python) urllib2를 통해 백업하는 방법이 나와있지만 프로그램 언어를 사용할 줄 모르는 저같은 사람이 단순히 보면서 따라하기엔 너무 어렵더군요. 파이썬 3.7버전까지 설치를 해놓고도 실행에서부터 막혀서 못하고 있습니다 ㅋㅋ
또 하나의 방법은 티스토리를 URL을 이용해 워드프레스로 이전하고 워드프레스에서 XML로 백업해서 구글로 이전하는 방법인데 이 또한 파이썬 프로그램을 써야 하더군요.
결론은 파이썬이라는 프로그램 언어를 사용할 줄 모른다면 티스토리의 포스팅들을 백업할 수 있는 방법이 현저히 없어진다는 것입니다.



파이썬(Python)의 대안으로 백업하는 방법

크몽을 통해 개발자에게 백업을 구매하는 방법도 안되고 직접 파이썬을 이용해 백업을 할 수도 없고 그렇게 포기를 해야 하나.. 하던 그때 또 하나의 방법을 찾았습니다.
메모 프로그램인 에버노트를 이용하는 방법인데 테스트 결과 일단 가능성은 있습니다. 티스토리에서 티스토리로 이전도 가능하고 티스토리에서 구글 블로그로 이전도 가능합니다.
티스토리로 이전하기 위해서는 티스토리 플로그 인에서 "에버노트 글 불러오기" 기능을 활성화해서 사용하시면 되고 구글 블로그로 이전하는 방법은 아래 따로 설명하겠습니다. 지금 옮길까 말까 생각 중인데 더이상 티스토리를 늘릴 계획은 없으니 계속 이 블로그에 글을 추가하던지 구글 블로그로 옮기던지 선택을 하긴 해야 합니다.... 구글 블로그로 이전하는 방법은 아래 설명을 따로 하겠습니다.


티스토리 블로그레서 에버노트를 이용한 구글 이전

하지만 이방법에도 문제점이 있습니다. 바로 한번에 다 옮길 수는 없다는 것인데 결국 글 1개당 1번씩 수동으로 해줘야 합니다. 지금 글을 쓰고 있는 정보성 블로그와 일상용 블로그를 합치면 약 900~1000개 정도의 글이 있는데 하루에 10개씩 해도 3달을 해야 하네요 ㄷㄷ 물론 오래걸리지 않으니 퇴근후 집에서 틈틈히 해도 하루에 30개씩은 할 수있을거 같지만 반복된 노동은 더 피곤을 불러오죠.
물론 티스토리에서 컨트롤 C,V로 붙복을 하라고 하는 분들도 있겠지만 그러면 사진은 어쩔?? 다시 사진만 따로 올리실건가요? 그게 더 노가다 일거 같습니다 ㅋㅋ 
에버노트를 이용해 티스토리에서 구글 블로그 이전시 장점
☞ 사진, 내용 등 기존글을 그대로 옮길 수 있다.
에버노트를 이용해 티스토리에서 구글 블로그 이전시 단점
☞ 게시글 1개당 1개씩 수동 작업을 해야 한다.
☞ 홈페이지 링크, 유튜브 동영상 링크, 애드센스 광고소스는 옮겨지지 않아 이것들은 구글에서 게시 전 따로 적용 시켜줘야 한다.

우선 에버노트를 설치를 해야 하는데 크롬을 이용하셔야 합니다. 크롬 웹스토어에 접속을 합니다. 링크를 클릭하시면 크롬 웹스토어로 이동합니다.

왼쪽 검색창에 "에버노트"라고 검색을 합니다. 3번째에 나오네요. "Evernote Web Clipper"를 이용해야 하므로 "Chrome에 추가"버튼을 눌러줍니다. 


"Chrome에 추가"를 했다면 크롬의 우측 상단에 "녹색 코끼리"모양의 아이콘이 생겼을 텐데요. 코끼리 아이콘을 클릭해서 에버노트에 로그인을 합니다. 구글 아이디로 연동이 가능하니 계정이 없다면 구글 아이디 로그인을 하시면 됩니다.
스크랩저장 : 스크랩 저장을 누르면 현재 화면을 저장합니다.







혹시나 싶어 어제 비공개로 전환한 티스토리 블로그와 안쓰는 구글 블로그를 각기 열어 놓고 테스트를 해봤는데 스크랩 저장을 누를 경우 +,-를 통해 스크랩 범위를 조절 할 수 있지만 문제가 있더군요.
☞ 카테고리를 선택할 경우 카테고리 내 글들이 쭉~ 나오는데 만약 10개의 글이 순서대로 나왔다면 그 10개의 글을 모두 스크랩합니다. 그런데 10개가 개별 저장이 아니라 한개로 인식을 하므로 1개의 포스팅글에 10개의 글이 들어가 버립니다.


☞ 개별로 스크랩을 하기 위해서는 필요한 부분만 마우스로 드래그로 선택한 뒤 마우스 우클릭을 하면 "선택한 항목을 에버노트로 스크랩"이 뜹니다. 타인의 블로그라면 우클릭방지가 되어 있으면 드래그를 못하겠지만 본인의 블로그라면 우클릭을 금지해놔도 티스토리에 로그인을 하면 드레그가 가능합니다. 사진과 글을 포함해서 드래그 해서 필요한 부분만 스크랩을 하면 됩니다.


☞ 구글 블로그와 에버노트를 연동하기 위해서 구글 블로그의 설정에 들어가서 "이메일을 이용한 글 게시"를 활성화 합니다. "본인 아이디.본인 인증 단어(아무단어)@blogger.com"를 설정한 뒤 즉시 게제를 할것인지 임시글로 저장을 할것인지 선택한 뒤 설정을 저장합니다.

☞ 스크랩을 저장한 에버노트에서 업로드 아이콘을 클릭합니다. 클립보드 복사와 메일이 뜨는데 여기서 "메일"을 클릭합니다.


☞ 구글 블로그의 이메일 "본인 아이디.본인 인증 단어(아무단어)@blogger.com"을 기입한 뒤 보내기를 하면 자동으로 구글블로그에 게시됩니다.









테스트 결과 화면을 그대로 사진으로 찍는 방법이 아니라 사진과 글이 별도로 저장이 되어 구글블로그에서 글수정 까지 문제 없이 잘 되네요. 스샷 찍듯이 사진으로 저장이 되면 하나마나일텐데 글과 사진이 개별로 스크랩되어 좋네요. 밤 11시쯤 스크랩을 통해 구글 블로그로 글을 이전해봤는데 다음날 오후에 구글에서 검색 노출이 되기시작하네요. 대략 12시간이 지나면 노출이 되는 듯 합니다. 단, 사진과 글은 스크랩을 통해 이동이 되지만 글자에 넣어둔 바로가기 링크, 유튜브 동영상 링크, 애드센서 광고 소스는 이동이 되지 않으니 수작업으로 다시 넣어 줘야 하는 불편함이 있습니다.

티스토리 백업 글 마무리

☞ 현재 티스토리 백업은 파이썬 (Python)을 통해 XML로 백업이 가능하지만 프로그램 언어를 모르는 일반인이 단지 따라하기로 백업하기엔 너무 어렵다.
☞ 구글 블로그에서 이메일로 포스팅을 허락할시 에버노트로 포스팅 한개 한개 이전이 가능하다. 즉, 포스팅이 적을 수록 유리하다.



Translate