[WP개발] 크롬에서 접속한 워드프레스 사이트가 갑자기 스타일 및 파일이 깨져보일때

내 맥 크롬에서 플젝연관된 특정 사이트가 갑자기 스타일이 깨진채로 보여서(이미지 포함) 확인해보았더니 이미지 경로나 다른 파일 참조 경로가 https로 자동으로 바뀌어있더라. 보안서버 설치도 안되어있는데.
그런데 재밌는건 사파리에선 잘된다는거...
다른사람 컴도 잘되고 모바일에서도 잘 나오고
공유기문젠가 하여 다른 와이파이로 접속해도 증상은 여전하고
바이러스 애드웨어 하나도 안잡히고
크롬 지웠다 깔아도 똑같고
시스템 clean같은거 해도 여전하고
그래서 chrome forum을 가서 봤더니


Site broken in Chrome (SSL issue) 
https://wordpress.org/support/topic/site-broken-in-chrome-ssl-issue/page/2

크롬업뎃이 되면서 wordpress에서 woocommerce계열은 다 https로 연결시켜버림.
여기는 우커머스를 설치하긴 했지만 결제모듈이 나중에 들어갈거라서 보안서버는 설치가 안되어있었던거고.

그래서 해당테마의 functions.php를 열어 아래와 같은 코드를 추가해주면 된다.
(강제로 https 비활성화)

$_SERVER['HTTPS'] = false;

이것때메 왜인가 하고 다 삭제하고 검사하고 쌩난리를 쳣네 ㅋㅋ 몇시간을 소비한것인가,,,

메르스 전파경로 시각화 - from KBS

HTML5 캔버스로 개발했네..

http://dj.kbs.co.kr/resources/2015-06-04/

뜯어봐봐야지.

그나저나 지역사회 전파는 오래지않아 일어날것 같네.

meta tag / 메타태그 예시

<meta property="og:title" content="제목"/>

<meta property="og:type" content="article"/>

<meta property="og:url" content="콘텐츠 전체 url"/>

<meta property="og:image" content="썸네일 이미지"/>

<meta property="og:description" content="콘텐츠의 간략한 내용"/>

<meta property="og:article:thumbnailUrl" content="아이콘"/>

<meta property="og:article:author" content="출처"/>

<meta property="og:article:author:url" content="출처 경로"/>

[Web 팁] 웹사이트에서 유투브 동영상 화면을 모바일에 최적화되어 보이게 하기

웹사이트(일반, 워드프레스, 기타 블로그 등)에 유투브 재생화면을 삽입 시

보통 데스크탑 사이즈에서는 잘 보이는데 모바일에서 보았을때 화면이 아예 늘어나버려서 다른 내용과 영역이 틀어져보일때

아래와 같은 코드를 삽입하여 모바일화면에서도 최적화되어 보이게 처리한다.

<div class="video-container">
         <iframe src="유투브동영상주소" frameborder="0" width="560" height="315"></iframe>
</div>

의 형식으로 HTML편집기에 삽입


CSS는 아래와 같이 지정한다.

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

- See more at: http://avexdesigns.com/responsive-youtube-embed/#sthash.9QwuEd44.dpuf


이렇게 하면 화면사이즈에 따라 재생플레이어가 유동적으로 변화한다.

여기서 굵은 표시가 된 iframe태그는 유투브 플레이 화면에서 하단에 있는
공유 > 소스코드로 이동하여 보이는 코드를 복사후 교체하면 된다.


예시 페이지 : http://bigture.co.kr/?p=4348



* 참고 사이트 : http://avexdesigns.com/responsive-youtube-embed/