Local by Flywheel (LocalWP)란? Local by Flywheel(현재 LocalWP)은 로컬 환경에서 WordPress를 쉽고 빠르게 실행할 수 있는 개발 툴입니다. ✅ 주요 특징 무료이며, Windows, Mac, Linux에서 사용 가능 PHP, MySQL, Apache/Nginx가 내장되어 있어 별도 설치 없이 사용 가능 CSS, JS 수정 후 즉시 반영 (실시간 변경 확인 가능) 멀티사이트 지원, SSL 인증서 자동 설정, WP-CLI 지원 … Read more
WordPress에서 사용자 지정 폰트를 삽입하는 방법은 여러 가지가 있습니다. 사용 목적과 편의성에 따라 적절한 방법을 선택하면 됩니다. 1. Google Fonts 사용 (가장 쉬운 방법) Google Fonts는 무료 웹 폰트를 제공하며, WordPress에서 가장 간단하게 적용할 수 있는 방법입니다. 1) functions.php에서 Google Fonts 불러오기 function enqueue_google_fonts() { wp_enqueue_style(‘google-fonts’, ‘https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;700&display=swap’, false); } add_action(‘wp_enqueue_scripts’, ‘enqueue_google_fonts’); 2) style.css에서 폰트 적용 … Read more
크롬 개발자 도구(DevTools)의 Elements(요소) 탭을 깊이 분석하여 HTML 구조, CSS 스타일, 디버깅 기능을 완벽히 이해할 수 있도록 정리해볼게요. 이 탭은 웹페이지의 DOM(Document Object Model)을 실시간으로 탐색하고 수정할 수 있는 강력한 도구입니다. 1. Elements 탭 기본 구조 Elements 탭을 열면 다음과 같은 UI 구성으로 되어 있습니다. ① HTML DOM Tree 현재 웹페이지의 DOM 구조를 탐색할 수 … Read more
크롬 개발자 도구 Elements(요소) 탭 실습 가이드 웹 개발을 하면서 페이지의 HTML과 CSS를 실시간으로 수정하고, 디버깅하는 방법을 배우는 것은 매우 중요합니다. 크롬 개발자 도구(DevTools)의 Elements(요소) 탭을 활용하면 코드 변경 사항을 실시간으로 확인하고, 디자인을 조정할 수 있습니다. 이 가이드를 따라 단계별로 실습해 보세요! 🚀 1. 개발자 도구 열기 1.1 크롬 개발자 도구 실행 방법 실습할 웹페이지를 … Read more
크롬 개발자 도구(Chrome DevTools) 완벽 활용 가이드 웹 개발자라면 크롬 개발자 도구(Chrome DevTools)를 반드시 활용할 줄 알아야 합니다. 개발자 도구는 HTML/CSS 수정, JavaScript 디버깅, 성능 분석, API 요청 확인 등 다양한 기능을 제공합니다. 이번 글에서는 크롬 개발자 도구의 핵심 기능과 활용법을 자세히 알아보겠습니다. 1. 크롬 개발자 도구 열기 단축키로 빠르게 열기 Windows/Linux: F12 또는 Ctrl … Read more
🔹 WordPress 주소(URL)와 사이트 주소(URL)의 차이 WordPress 설정에서 “WordPress 주소(URL)” 와 “사이트 주소(URL)” 두 개의 설정이 있습니다. 이 둘의 차이를 명확히 이해하면 도메인 변경, 서브디렉토리 설치, 멀티사이트 구성 등에서 문제를 예방할 수 있습니다. ✅ 1. “WordPress 주소 (WordPress Address, siteurl) 📌 설정 위치: wp-admin → “설정” → “일반” WordPress가 실제로 설치된 위치를 나타냄 wp-login.php, wp-admin … Read more