본문 바로가기

홈페이지만들기

(72)
Smush Image Compression and Optimization 워드프레스 플러그인 Smush Image Compression and Optimization 워드프레스 플러그인 WPMU DEV 슈퍼 팀에 의해 당신에 소개 된 매우 강력하고 100 % 무료 WordPress 이미지 smusher를 사용하여 이미지의 크기를 변경하고 최적화하고 압축합니다. 우수한 승리 이미지 최적화Smush 속도와 퀄리티를 위해 벤치마킹되고 시험 된 제 1위이며, WordPress 상을 수상하고 검증 된 인기 이미지 최적화 플러그인입니다. 이번에는 이미지의 크기를 변경! 최대의 폭과 높이를 설정하면 큰 이미지는 압축되면서 축소됩니다.우리의 서버는 힘듭니다. 사진에서 숨겨진 대량의 정보를 제거하고 품질 저하없이 파일 크기를 축소합니다. 큰 이미지 파일, 당신은 몰라도 당신의 사이트를 느리게하고 있을지도 모릅니..
워드프레스 페이지 빌더의 행과 열 사용법 워드프레스 페이지 빌더의 행 사용법 워드프레스 플러그인 페이지 빌더에 대해 설명을 드렸습니다. 설명드린 일반적인 인터페이스에 대해 설명하고 장단점을 정리했는것을 읽었다고 가정하고 설명해 드리겠습니다.이 가이드는 페이지 빌더를 사용하여 페이지를 작성하는 고급 개념에 대해 도움을 줍니다. 행 추가하기 행은 페이지 레이아웃의 전체 구조를 형성하고 있습니다. 이것이 귀하의 페이지에 추가 할 첫 번째 사항입니다. 행을 추가하려면 '행 추가'를 클릭하시기 바랍니다. 'Add New Row (새 행 추가)'대화 상자가 나타납니다. 행 레이아웃 설정 행의 셀수와 셀비율 및 해당 비율을 적용 할 방향 (왼쪽 또는 오른쪽)을 선택하여 행레이아웃을 설정할 수 있습니다. 페이지 빌더는 이 값을 변경할 때 레이아웃을 업데이트하..
워드프레스 플러그인 젯팩 Jetpack by WordPress.com Jetpack - WordPress 페이지 빌더는 표준 WordPress 위젯과 함께 작동하므로 필요한 위젯을 항상 찾을 수 있습니다. SiteOrigin을 만들었습니다. WordPress 사이트를 안전하게 유지하고 트래픽을 늘리며 접속자의 참여를 유도하십시기 바랍니다. 트래픽 및 검색 엔진 최적화 도구트래픽은 모든 웹 사이트의 피입니다. Jetpack에 포함되어 있습니다. [무료] 사이트 통계 및 분석[무료] Facebook, Twitter, LinkedIn, Tumblr, Reddit 및 WhatsApp에서의 자동 공유[무료] 관련 글[유료] Google, Bing, Twitter, Facebook 및 WordPress.com을위한 검색 엔진 최적화 도구[유료] 애드 센스, Facebook 광고, A..
워드프레스 플러그인 Page Builder Interface 페이지 빌더 인터페이스 Page Builder Interface 페이지 빌더 인터페이스 워드프레스 플러그인 (Page Builder Interface) 페이지 빌더 플러그인 인터페이스는 드레그를 통하여 쉽게 구조화를 만들수 있습니다. 그리드형식인 박스는 넓이와 높이를 쉽게 조절할 수 있으며 곤련된 위젯을 통해 상호 보완이 가능합니다. 먼저 인터페이스를 살펴 보겠습니다. 페이지 빌더는 표준 WordPress 에디터에 추가하여 탭을 추가합니다.이 탭을 클릭하면 Page Builder 인터페이스가 표시됩니다. 도구 모음도구 모음을 사용하여 위젯을 추가하거나 새 열의 행을 추가하거나 미리 만들어진 레이아웃을 불러들여 구성 할 수 있습니다. 행 조치행을 삭제하고 이동하려면이 버튼을 사용합니다. 위 / 아래 아이콘은 행을 선택하고 위로 ..
워드프레스 유용한 플러그인 SiteOrigin Page Builder SiteOrigin Page Builder 워드프레스 홈페이지 제작할때 초기에 유념해야할 부분은 첫번째 어떤 플러그인을 활용하여 효율적인 홈페이지를 만드는가 입니다. 홈페이지 만드는데 여기 플러그인 선정에서 50%를 차지하는 것 같습니다. 그래서 유용한 플러그인을 소개해 드릴까 합니다. 이전에 테마를 추천해 드렸는데 빈티지테마에는 아주 잘 맞춰진 플러그인 SiteOrigin Page Builder 페이지 빌더입니다. 1. 간단한 콘텐츠 제작 인터페이스. 인터페이스가 간단하여 즉시 인식 가능하여 놀라울정도 입니다.SiteOrigin에 따르면 Page Builder는 픽셀 정밀도로 모바일 장치에 대한 반응이 빠른 그리드 기반의 페이지 콘텐츠를 쉽게 만들 수 있습니다. 이것은 집, 연락처, 회사 소개, 또는 ..
Html5 표현태그 텍스트서식태그 Html5 표현태그 텍스트서식태그 Html5의 텍스트서식태그에는 ,,,,,,,,,가 있습니다. 이런 Html5텍스트 태그의 정의를 정확히 알아보고 활용하여 코딩과 디자인하는 방식을 알아보도록 하겠습니다. 그러면 초급용으로 Html5태그의 정의를 간단하게 설명해보겠습니다.(최대한 간단하게...) 12345678910cs 태그는 굵게 표시된 텍스트를 정의합니다.예를 들어본다면 아래와 같이 표현됩니다.1태그는 굵게 표시된 텍스트를 정의합니다.cs 태그는 굵게 표시된 텍스트를 정의합니다. 태그는 삭제된 텍스트를 정의합니다. 글자의 취소선이 표현되는 태그입니다.1글자의 취소선이 표현되는 태그입니다.cs 글자의 취소선이 표현되는 태그입니다. 태그는 일반적인 글자형태의 변형으로 강조 텍스트를 정의합니다.1일반적인 글..
CSS a href 링크 / div 링크 100% 버튼 CSS a href 링크 / div 링크 100% 버튼 사람들이 가장 많이 사용하고 있는 CSS a href 링크와 div 링크는 쉬우면서도 어려워 합니다. 그 이유가 버튼형으로 만들때 가장 많이 그렇습니다. 어려워 하시는 분들을 위해 간단해게 수정해서 사용할수 있는 소스를 만들어 보았습니다. 활용하여 막힘없는 코딩하시기 바랍니다. 기본체크----------• a:link - 체크하기전 링크• a:visited - 체크한 링크• a:hover - 사용자 버튼오버링크• a:active - 사용자 클릭링크 링크의 정렬과 target설정하는 방법을 아래에 정리해 놓았으니 참고 하시기 바랍니다. 이 예제는 몇 가지 CSS 속성을 결합하여 링크를 버튼으로 표시하는 고급단계 예제를 보여주었습니다. a href --..
인포그래픽 아이콘사용방법 인포그래픽 아이콘사용방법 현재도 계속 추가되고 있는 인포그래픽 아이콘 (익스 11 부터 사용 가능합니다)​웹서버에 다운로드에서 사용할 수도 있으나 다운로드 없이도 사용이 가능합니다.인포그래픽 아이콘을 사용하기 위해서는 해당 소스를 header.php 파일 내에 중락 안에 있는 내용을 입력해주시면 됩니다.그리고 인포그래픽 아이콘을 이용하기 위한 페이지에서 가셔서 아래와 같이 입력하면 편하게 사용 가능합니다.​ex) php 파일에 직접 사용시 (해당 사이트에 가시면 아래와 같이 사용 할 수 있는 소스가 있습니다) fa fa-cloud 아이콘 전체 참고 일반적인 아이콘 종류별 표현 형식 세련된 글꼴 멋진 아이콘 (크기, 색상, 그림자) 참고아이콘 : http://fontawesome.io/icons/ HTML..