로그인 페이지 커스타마이징

안녕하세요. 로그인 페이지 커스타마이징에 관해서 한가지만 더 여쭙겠습니다.

어제 지시해 주신 소셜로그인 보턴 주변 레이아웃을 조절하면서, 로그인 버튼 위치를 조금 바꿔보았는데요, 여기를 손대면 저기가 바뀌고....저기를 손대면 여기가 바뀌는 현상을 결국 제힘으로는 해결하지 못하고 꼬박 하루를 소비해 버렸습니다. ㅜㅜ

브라우저 폭을 좁힐때 마다 아래와 같이 6번이나 레이아웃이 조금씩 변해 버리는 데요, 컴퓨터로 볼때는 1번, 모바일에서 볼때는 6번으로 통일하려면 어찌해야 하나요?  나머지 중간 것들은 삭제해도 좋습니다.

 

1-

https://www.evernote.com/l/ACveJSZqhudGn5hnvWd8xzZMImHLbkjqjcA/

2-

https://www.evernote.com/l/ACszXqVlXjdDp5_KQ3B9G_nC1CDDKAGGwEY/

3-

https://www.evernote.com/l/ACttEpk_wF1Fw5wpxLF0Mq_6g_j4_U_XEJw/

4-

https://www.evernote.com/l/ACsuytxtlX9GdqmmRhr67iwCNgDa5jFeD9s/

5-

https://www.evernote.com/l/ACsuEIYhXYFKUJ__Da1k3DNzxMNIcbhYdjk/

6-

https://www.evernote.com/l/ACsOqaxwgIZEx6vwJAVQE4D41QKiLnT1Y78/

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    코스모스팜 회원관리 플러그인 로그인 페이지는 테마 쪽에서 설정한 너비만큼 표시됩니다.

    그렇기 때문에 사이드 바를 사용할 경우 브라우저의 너비를 조절해서 보면

    적용하신 CSS 코드가 원하는 대로 적용되지 않을 수도 있습니다.

     

    CSS 미디어 쿼리를 적용해서 문제가 되는 브라우저의 폭을 확인하신 후

    별도로 CSS 코드를 추가해주셔야 할 듯합니다.

     

    워드프레스 로그인 화면 디자인 수정 방법도 참고해보세요.

    고맙습니다.

  • 안녕하세요.

    모바일에만 적용하시려면 단순히 HTML과 CSS 코드로는 어려울 듯합니다.

    저희도 좋은 방법이 있을지 연구해보겠습니다.

    고맙습니다.

  • 게시판과 같은 줄 알고....지적해 주신 대로 default 스킨을 수정했었네요. 감사함니다

    그런데, 이걸 모바일에만 적용 시키려면 어떻게 해야 하나요?

  • 안녕하세요.

    올려주신 페이지 주소로 확인해보니

    현재 코스모스팜 회원관리 플러그인 two 스킨을 사용 중이신 듯합니다.

    수정하신 코드가 default 스킨 쪽은 아닌지 확인해보셔야 할 듯합니다.

    two 스킨 쪽 login-form.php 파일을 수정해보시겠어요?

     

    코드 수정 후에는 브라우저의 캐시를 비우신 후에 확인해보세요.

    크롬 브라우저에서 강력 새로고침 단축키는 Ctrl + Shift + R 입니다.

    고맙습니다.

  • 말씀하신 <input type="text" id="log" name="log"> 와 <input type="password" id="pwd" name="pwd"> 는 발견되지 않아서, 그대신에 

    <input name="pwd" type="password" id="pwd" class="password"> 와 <input name="log" type="text" id="log" class="username"> 를 지시하신 대로 수정했는데요. 아무 변화가 없네요.

    어쩌면 좋을는지요?

  • 로그인 페이지에서 placeholder를 추가하시려면 스킨 파일을 수정해보시겠어요?

    FTP로 접속해서 /wp-content/plugins/cosmosfarm-members/skin/사용중인스킨/login-form.php 파일에

    아래의 코드를 찾아서

    <input type="text" id="log" name="log">

    아래의 코드로 교체해보세요.

    <input type="text" id="log" name="log" placeholder="이메일...">

    아래의 코드를 찾아서

    <input type="password" id="pwd" name="pwd">

    아래의 코드로 교체해보세요.

    <input type="password" id="pwd" name="pwd" placeholder="비밀번호...">

    위의 코드에서 placeholder 쪽 문구는 적절히 수정해보세요.

     

    만약, login-form.php 파일을 테마 쪽에 추가해서 커스텀 중이시라면

    /wp-content/themes/사용중인테마/cosmosfarm-members/login-form.php 파일에서 수정해보시겠어요?

    고맙습니다.

  • 필드 편집 페이지에서 Placeholder 입력 필드에 문구를 입력해도,로그인 화면에서는 표시가 안 되는데요?

    https://antfx.kr/login/

  • 안녕하세요~^^

    파일 수정보다는 WP-Members 쪽 설정을 확인해보시겠어요?

    이메일, 비밀번호 필드에 Placeholder를 적용하시려면

    워드프레스 관리자 -> 설정 -> WP-Members -> 필드 페이지에서

    이메일 필드와 비밀번호 필드에 편집 버튼을 눌러보시겠어요?

    필드 편집 페이지에서 Placeholder 입력 필드에

    원하시는 문구를 입력하신 후 필드 편집 버튼을 눌러보신 후 확인해보시겠어요?

    고맙습니다.

  • 안녕하세요 결국, 해결되지 않아서 라벨을 삭제하는 것으로 타협하고 해결했습니다.

    마지막으로 이 질물에는 자세히 답해주시면 감사하겠습니다. 

    입력란 배경에, '이메일'과 '비밀번호' 택스트 를 표기하려면 어떤 파일을 어떻게 고쳐야 하는지요?

    https://www.evernote.com/l/ACvRiOuvT3BCQL3wLENEVIPTFOD_RLLBfP8/

  • 안녕하세요.

    WP-Members 플러그인을 삭제한다고 해서

    워드프레스 관리자 페이지 사용자 정의하기 쪽 CSS 코드가 지워지지는 않습니다.

    또, 로그인 페이지 CSS 코드를 WP-Members 플러그인 쪽에서 수정하신다면

    업데이트나 플러그인 삭제 시 수정하신 코드가 지워질 수 있습니다.

     

    로그인 페이지의 HTML을 수정하시는 경우라면

    기존 스킨 파일을 아래의 경로처럼 테마 내 디렉토리로 복사해서 작업해보시겠어요?

    /wp-content/themes/사용중인테마/cosmosfarm-members/login-form.php

    수정하신 코드는 항상 백업해두셔야 할 듯합니다.

    고맙습니다.

  • 저는 언제나 테마의 관리화면에 있는 css 편집기를 통해서 수정을 하곤 하는데요, 최근 며칠 동안 여기에는 손대지 않았고, 단지 WP-Members를 삭제했다가 다시 설치했을 뿐인데, 현재처럼 망가져서 표시됩니다.

    혹시 로그인 페이지의 디자인은 관리화면에 있는 css 편집기가 아닌 아래폴더의 파일을 직접 편집해야 하는 건가요? 

    wp-content\plugins\wp-members\css

    최소한 '비밀번호 찾기' '와  회원가입' 버튼만이라도 삭제 전 레이아웃처럼 복구하고 싶은데, 어떤 코드를 어느파일에 넣어야 하는지 알려주실 수 있나요?

    물론, css 편집기에 기록된 내용과, 데이터베이스 파일은 열심히 백업하고 있지만, 이런 사태가 발생했을 경우 어떻게 대처해야 할지 조금 막막하네요. 전채백업으로 복구해 버리면 다른 정상적인 내용들도 이전으로 돌아갈테니 그럴 수도 없고..

  • 안녕하세요.

    별도로 수정하신 파일을 백업해두지 않으셨다면

    호스팅의 백업 데이터를 사용해서 복구해보시겠어요?

    호스팅 업체에 얼마간의 데이터가 보관되어 있을 겁니다.

    수정하신 파일은 별도로 PC나 다른 저장소에 백업해두시는 걸 권장드립니다.

    고맙습니다.

  • 실수로, WP-Members를 삭제했다가 다시 설치를 했는데요, css 파일에는 전혀 손을 대지 않았는데 아래와 같이 망가져서 표시되네요.

    삭제전 레이아웃으로 복구하려면 어찌해야 하나요?

    https://www.evernote.com/l/ACsPRfX0p6JHopLELtGJPBnYrhbn6CPL100/

     

    ●삭제전 레이아웃

    https://www.evernote.com/shard/s43/client/snv?noteGuid=de25266a-86e7-469f-9867-bd677cc7364c&noteKey=2261cb6e48ea8dc0&sn=https%3A%2F%2Fwww.evernote.com%2Fshard%2Fs43%2Fsh%2Fde25266a-86e7-469f-9867-bd677cc7364c%2F2261cb6e48ea8dc0&title=%25ED%2599%2594%25EB%25A9%25B4%2B%25ED%2581%25B4%25EB%25A6%25BD

  • 네, 이중으로 표시되는 게 좀 거슬리긴 하지만...좋은 방법을 찾으 실 때까지 기다려 보겠습니다~

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기