회원관리 플러그인에서 아바타(프로필 사진) 변경 관련 질문입니다.

안녕하세요.

아바타(프로필 사진) 변경 관련하여 질문 드립니다.

 

프로필에서 파일을 업로드 하게 되면 'cosmosfarm_members_avatar_form_submit(this)' 를 호출하여

jQuery('#cosmosfarm_members_avatar_form').submit() 을 실행하게 됩니다.

그리고 해당 함수의 종료 후에 바로 새로고침이 되어버립니다.

 

그런데, 제가 여기서 하고 싶은 작업은

submit 완료 후 페이지를 새로고침 하지 않고 ajax로 이미지만 전송 후 해당 아바타의 주소만 받고 싶습니다.

 

하지만,

코스모스팜 멤버스 - 테마의 script.js 파일에서 'jQuery('#cosmosfarm_members_avatar_form').submit()' 을 제어할 수 있는 함수를 찾지 못하겠습니다.

혹시 해당 스크립트의 위치를 알 수 있을까요?

 

아니면, 이를 수행할 수 있는 방법에 대해 설명 부탁드립니다.

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

    코스모스팜 회원관리 플러그인에서 아바타 변경 시 호출되는

    cosmosfarm_members_avatar_form_submit 자바스크립 함수는

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

    아래의 코드입니다.

    function cosmosfarm_members_avatar_form_submit(input){
    	jQuery('#cosmosfarm_members_avatar_form').submit();
    }

    위의 코드가 실행된 후 실제 아바타 이미지 파일을 업로드하는 코드는

    /wp-content/plugins/cosmosfarm-members/class/Cosmosfarm_Members_Page_Builder.class.php 파일에

    member_links_args 함수에서 실행됩니다.

     

    아래의 코드를 확인해보시겠어요?

    if(isset($_POST['cosmosfarm_members_avatar_nonce']) && wp_verify_nonce($_POST['cosmosfarm_members_avatar_nonce'], 'cosmosfarm_members_avatar')){
    	
    	$file_handler = get_cosmosfarm_members_file_handler();
    	$upload_file = $file_handler->upload_avatar('cosmosfarm_members_avatar_file');
    	
    	if($upload_file){
    		$cosmosfarm_members_avatar = get_user_meta($current_user->ID, 'cosmosfarm_members_avatar', true);
    		
    		if($cosmosfarm_members_avatar){
    			$upload_dir = wp_upload_dir();
    			@unlink("{$upload_dir['basedir']}{$cosmosfarm_members_avatar}");
    		}
    		
    		update_user_meta($current_user->ID, 'cosmosfarm_members_avatar', $upload_file['url']);
    	}
    }

     

    어떤 이유로 submit 완료 후 페이지를 새로고침 하지 않고

    ajax로 이미지만 전송 후 해당 아바타의 주소만 가져오시려는지 알려주시면

    저희도 도움을 드릴 방법을 찾아보겠습니다.

    고맙습니다.

  • 안녕하세요.

     

    회원가입 이나 로그인 시 특정 설정을 하지 않은 유저들을 대상으로

    자신의 프로필 이미지 및 기타 여러 정보들을 입력하는 팝업레이어를 만들고자 합니다.

     

    구체적으로 저희 홈페이지는 한류 커뮤니티를 지향하고 있고

    인스타그램과 유사하게 개인 홈이 있는데, 자신이 응원하는 스타 선택, 자신의 개인홈에 소개글 등 의 정보를 입력을 하지 않은 유저들을 대상으로 설정하는 팝업레이어를 생성하고자 하고 있습니다.

     

    그 설정하는 내용 중 프로필 사진 업데이트 부분을 넣고 싶은데, 기존의 프로필 사진 업데이트는 새로고침이 되어버리기 때문에 기능구현에 있어서 조금 문제가 있는 상황이었습니다.

  • 제 생각이 맞다면, 지금 현재는 submit 시 같은 페이지로 post 요청을 하게 되고,

    post 요청시 아래의 조건문 부분에서 파일을 업로드 한 후에 변경된 아바타 정보를 화면에 다시 표시하도록 렌더링 시키는 것 같은데

    if(isset($_POST['cosmosfarm_members_avatar_nonce']) && wp_verify_nonce($_POST['cosmosfarm_members_avatar_nonce'], 'cosmosfarm_members_avatar')){
    	
    	$file_handler = get_cosmosfarm_members_file_handler();
    	$upload_file = $file_handler->upload_avatar('cosmosfarm_members_avatar_file');
    	
    	if($upload_file){
    		$cosmosfarm_members_avatar = get_user_meta($current_user->ID, 'cosmosfarm_members_avatar', true);
    		
    		if($cosmosfarm_members_avatar){
    			$upload_dir = wp_upload_dir();
    			@unlink("{$upload_dir['basedir']}{$cosmosfarm_members_avatar}");
    		}
    		
    		update_user_meta($current_user->ID, 'cosmosfarm_members_avatar', $upload_file['url']);
    	}
    }

     

     

    그렇다면,

    위의 조건문 부분을 복사하여 별도로 함수를 생성하고, ajax action을 추가한 후에 response의 내용을 해당 이미지의 주소로 하면 되나요?

     

    function cosmosfarm_members_avatar_form_submit(input){
    	jQuery('#cosmosfarm_members_avatar_form').submit();
    }
    


    이 submit 부분도 ajax에 맞게 변경하구요....

  • 네, 맞습니다.

    진행해보시고 막히는 부분 있으면 댓글로 알려주시면 도움을 드리겠습니다.

    고맙습니다.

  • 안녕하세요. 잘 완성했습니다!

     

    추후에 해당사항을 정리할 기회가 있으면, 많은사람이 볼 수 있도록 해결방법을 포스팅해보도록 하겠습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기