리플입력 부분에 자신의 사이트(블로그)등등을 입력할수 있는 필드삽입 




Vanns Kang 님의 티리움스킨을 부분부분 변형/추가 해가며 잘사용중이다

전반적은 아니지만 컨텐츠폭이라던가 사이드바부분 등등을 살짝 수정했다

(인용구 txt 컬러 사이드바 리플/최신글 목록출역  공지상항이 필요 없는 블로그이기에 

공지상항 입력란을 블로그 프로필 용으로 변형등등....)

전문 왭디자너가 아니다보니 HTML이나 CSS시트등을 마음대로 주무르긴 힘들지만

티스토리의 치환자등을 간단히 고민좀해보면 자신만의 사용환경을 충분히 만들어 갈수 있다고본다

특히 사용중인 스킨은 반응형이지만 많은 컨텐츠부분을 과감히 생략한 스킨이므로 

공백묘를 잘살리면 필요한 자신만의 블로그 스킨으로  탈바꿈이 가능 하리라 본다


이번엔 리플폼에 비로그인 방문자들이 필수가 아닌 선택적으로 자신들의 홈페이지나 블로그 혹은 카카오스토리 주소등을 남김으로서 

블로그간의 커뮤네이션이 원할할수 있도록 "홈페이지 입력폼"필드를 추가해 보았습니다.

물론 스킨의 원배포자분은 이스킨에 필요없는 많은 부분들을 과감히 삭제하므로서 간단하고 심플하게 포스팅하기 좋은 환경으로 

스킨의 subject 를두었지만 사용자마다 견해는 조금식 다르며 저의 "블로그 사용환경에서는 이부분은 필요하다" 판단하여 타사이트 서비스이용자 

분들의 편의제공을 위한 입력필드를 추가합니다.

*타사이트의 개인블로그 운영자분들의 logo 아이콘이 등록 되는 것입니다 

개인블로그들의 로고 등록 방법은 아레 링크의 엘포이야기 님의 블로그에 설명이 등제되어 있습니다


엘포 이야기님 블로그  



홈페이지 입력필드추가

이미지삽입 

기존의 필드인 이름 입력필드를 이용 (복사/수정) 치환자를 교체 함으로서 

간단하게 필드란을 추가해 보았습니다 

다행히 치환자 부분수정 만으로 필드추가가 가능해서 다행입니다

티스토리 스킨이 낯섫어서 수정때마다 고민좀 되거든요 ^^;;


홈페이지 필드의 추가


위에 이미지를 보시다시피 home page 필드가 성공적으로 추가 되었습니다.

필수가 아닌 선택이란 설명과함께...

이름과 비밀번호는 필수입력이지만 홈페이지나 블로그주소는 선택이 됩니다 즉 입력을 안해도 댓글 등록은 가능하다는 말이죠.


자 아래는 자신의 홈페이지를 등록한 댓글 예시 입니다 

제 개인블로그와 카카오스토리의 주소를 입력해 봤습니다 입력시 HTTP://..부분은 생략하고 자신의 블로그주소만 입력해도 됩니다,



내,,

사이트 주소를 입력하니까 제개인 블로그 아이콘은 자동으로 입력이 되는군요 

카카오스토리는 일단 아이콘등록은 안됩니다. 그러나 작성자의 사이트링크는 흔적이 남음으로서 블로그간의 방문이나 커뮤네이션이 가능해 졌습니다.


아래 이미지는 제가 수정한 스킨의 HTML 부분 이미지 입니다.

이수정은 관리  -> 스킨수정 으로 들어가셔서 HTML을 수정하시면 간단합니다.


2016:08:10 08:36:46스킨수정부분


이미지의 표시부분이 수정한 스킨HTML 부분 입니다

저같은경우는 위치환자의 "nane"소스를 드레그해서 아래 붙혀놓고는 치환자만 교환 했네요;


치환자의 도움말은 이곳에서 소스를 얻었습니다..


http://www.tistory.com/guide/skin/step3#2-8-6-2


Tistory의 스킨가이드 페이지 입니다

저도 시간날때마다 한번씩 들어가 읽어보곤 합니다..

이곳 치환자들이 예전 오마이뉴스의 치환자들과 비슷한듯도 하더군요;;;


마지막으로 제가 사용한 스킨의 수정부분 입니다.



*HTML


<!-- begin commentWrite -->

<!--//리플입력폼 수정할부분// -->

<s_rp_input_form>

<div class="commentWrite">

<div class="row">

<div class="col-md-12">

<form role="form">

<s_rp_member>

<s_rp_guest>

<div class="row">

<div class="form-group col-md-6">

<label for="[##_rp_input_name_##]_[##_article_rep_id_##]">name*필수</label>

<input type="text" id="[##_rp_input_name_##]_[##_article_rep_id_##]" name="[##_rp_input_name_##]" value="" class="form-control textField" placeholder="enter name">

</div>

<div class="form-group col-md-6">

<label for="[##_rp_input_password_##]_[##_article_rep_id_##]">password*필수</label>

<input type="password" id="[##_rp_input_password_##]_[##_article_rep_id_##]" class="form-control textField" maxlength="8" name="[##_rp_input_password_##]" value="" placeholder="password">

</div>

<!--//홈페이지 입력란 삽입부분//-->

<div class="form-group col-md-6">

<label for="[##_rp_input_homepage_##]_[##_article_rep_id_##]">home page*선택</label>

<input type="text" id="[##_rp_input_homepage_##]_[##_article_rep_id_##]" name="[##_rp_input_homepage_##]" value="" class="form-control textField" placeholder="http://">

</div>

<!--//end 홈페이지 입력란//-->

</div>

</s_rp_guest>

<div class="checkbox secret-line">

<input type="checkbox" name="[##_rp_input_is_secret_##]" class="checkbox" id="[##_rp_input_is_secret_##]_[##_article_rep_id_##]" name="[##_rp_input_is_secret_##]" value="1"/> secret

</div>

</s_rp_member>

<div class="row">

<div class="col-md-12 content-line">

<textarea id="[##_rp_input_comment_##]_[##_article_rep_id_##]" placeholder="enter comment" name="[##_rp_input_comment_##]" class="form-control" rows="10"></textarea>

<button type="button" class="btn btn-default btnComment" onclick="[##_rp_onclick_submit_##]">submit</button>

</div>

</div>

</form>

</div>

</div>

</div>

</s_rp_input_form>

<!--//end 리플입력 수정할부분// -->

<!-- end commentWrite --> 


저와 비슷한 환경에서 스킨을 사용하시는 분들께 작은 도움이나마 공유해 볼끼해서 기록을 남겨봅니다.


궁금하신 부분은 리플에 달아주시기 바랍니다.


sns 소셜공유

이웃추가

카카오톡은 모바일에서만 됩니다


WRITTEN BY
내다보는창
누군가를 위한 들여다보는 창이아닌 내스스로 살펴보는 "창"이되는 BLOG"

받은 트랙백이 없고 , 댓글  8개가 달렸습니다.
  1. 타사이트리플의 예시입니다 ,

    닉네임을 선택하시면 이벤트가 발생 합니다
  2. 프론트 페이지를 만드는 방법이 어딘가에 있던데 이블로그의 특성상 프론트 페이지는 안어울리는 듯해서 만들질 않았습니다
    프론트 페이지 대신 사이드바에 최신글과 답글목록을 만들고 블로그 프로필란을 두어 간이 프론트 페이지 역활을 하게두었죠
  3. 저도 요즘 블로그 새로 시작하고 부터 입맛에 맞게 고쳐보려고 이것 저것 지지고 볶고 해보는데, 마음같이 잘 안풀리네요.

    이럴 땐, 스크립트 잘 하시는 분들 뵈면 부럽기만 하네요. 참고 많이 하고 갑니다.
    • 저도 자바쪽 구문 거이 맹탕 입니다 ㅎㅎ
      스타일 시트 몇부분과 HTML 소스에 티스토리 자체 치환자가 있어요 그부분들 조금 손본것 뿐 입니다 ^^;;
      방문 감사 드립니다
    • 블로그는 일단 내용이 아닐까요? 그래서 Eddy Jay 님 블로그의 멋진 사진들 가끔식 둘러 보곤 한답니다 ^^
  4. 많은 도움이 됩니다.

    모바일에서 메뉴 자동 닫힘 현상이 나타납니다. 혹시 해결하셨습니까?

    잘 보고 갑니다. 행복한 시간되세요.
  5. 일정 모바일 부라우져 (구글크롬) 에서 사이드 메뉴가 스트롤시 자동으로 닫히는 버그 말씀 하시는거죠?
    저도 이 부분이 불만족이라 이리저리 소스를 들여다 봤습니다만 원래 스킨 게시자님이 소스로 쓰신 부트스트렙 소스파일이 문제 인것 같더군요 저의 생각으로는 윈도우 본문창을 선택시 자동으로 닫히는 스크립 소스가 스크롤시 에도 적용되어 일정부분 이상 스크롤 될시에 자동으로 닫히는 이벤트가 발생 하는듯 합니다
    이부분을 수정하고 싶었습니다만 저도 정확한 원인을 찼기가 힘들더군요
    깔끔해서 사용하는 이스킨의 가장큰 단점 인듯 합니다
    우측 사이드의 카테고리 메뉴가 간단한 블로그 들은 사용에 큰 불편이 없겠지만 저처럼 사이드에 메뉴가 많은 블로그는 불편함이 많더군요 ;;;
    혹시라도 이후 버그가 수정 되면은 이글에 댓글을 다시 달겠습니다 ^^
secret