본문 바로가기

반응형

분류 전체보기

(511)
레이지 로딩 레이지 로딩은 사이트가 로딩될 때 전체페이지를 한 번에 로딩하지 않고 필요한 페이지만 로딩하고 일부페이지는 해당 페이지에 요청이 있을 때 로딩하는 방식을 말합니다. 레이지 로딩은 필요한 파일만 다운로드하기 때문에 웹사이트의 속도 등 성능향상의 장점이 있습니다. 구현하기 프로젝트 생성 (생성 시 앵귤러라이터 사용 체크) 앵귤러 - 씨엘아이 앵귤러 씨엘아이는 (커맨드라인 인터페이스)는 앵귤러 어플리케이션을 만들고 관리하는데 권장되는 도구입니다. CLI 설치 npm install -g @angular/cli 버전 및 버전 이력 확인 (https://github.com/angular/angula jin-co.tistory.com 컴포넌트 추가 구현을 위해 필요한 컴포넌트를 아래와 같이 추가합니다. ng g c ..
GTM (Triggering) - Page View In the container, go to 'workspace' -> 'tags' -> 'new' Click the 'tag configuration' box Select 'Google Ads conversion tracking' Enter the ‘Conversion ID’ and ‘Conversion label’ (To check conversion ID and label, click here, If you are missing a conversion linker, follow this instruction) Then click ‘Triggering’ box at the bottom (you can also set this in the previous page) Click '+' button Sele..
Google Tags - Conversion Linker Set Up Conversion linker is a tag that improves the accuracy of conversions. One conversion linker is shared throughout all the conversions. You can either create one directly or as part of setting a conversion up. Since setting it up as part of setting a conversion comes with all the configuration, we will go with the latter first. Setting Up as Part of A Conversion Go to your GTM container and click ..
Google Tags - Google Ads Conversion Tag Set Up Finding the Conversion Summary Page First, let’s move to the conversion page. To do so click ‘tools and settings’ menu on the top menu in your Google Ads account Choose the conversion action title (the blue link) Open 'tag configuration' We have two options to implement: Install the tag yourself Using GTM 1. Install the tag yourself Click ‘Install the tag yourself’ We need to check if there is a..
Google Tags - Google Ads Global Tag Set Up For any kind of data to be collected by Google products, we have to linke the site and Google products using either global tag or GTM. Here we will see how we can implement global tag to a site Implementation In your Google Ads account, go to 'tools and setting' -> 'conversions' Select the action title Open 'tag configuration' box -> select the first option Copy the tag below For the global tag ..
Google Ads Conversion Setup In Google Ads, conversion is the actions that are valuable to your business among the other actions (events), be it clicking a purchase button or staying at your website for a certain amount of time. When you create a conversion in Google Ads it is possible to visualize if your advertising campaign is driving profits. I will show you various ways how to set up conversions in Google Ads in this w..
tstory - How to Add A Clipboard Function As my blog is about web development, I have decided to add a clipboard feature to allow users to copy and paste the codes easily. Completed Codes Implementation Looking at several possible ways, I decided to use JavaScript's navigator object to implement this due to its easy implementation and not requiring any additional configurations. We just need to call the necessary function under the navi..
코드 클립보드에 복사하기 기술블로그인 만큼 코드가 많이 들어가는 데 일일이 복사하는 불편함을 덜고자 클립보드 복사기능을 추가하기로 하였습니다. 완성코드 구현하기 클립보드로 복사하는 기능은 추가설정이 필요 없고 구현이 가장 수월하다고 판단하여 자바스크립트에서 제공하는 내비게이터 객체를 사용하기로 하였습니다. 작동은 아래처럼 내비게이터 객체의 클립보드를 호출하고 원하는 텍스트를 저장하는 방법입니다. navigator.clipboard.writeText(copyText.value); 다음으로, 코드를 복사하기 위해 코드요소에 이벤트를 연결해야 하는데요. 코드요소와 코드 클래스를 통해 전체요소를 잡고 루프를 통해 구현하는 방식으로 결정하였습니다. 이벤트는 아이템을 개별복사하는 경우도 있으므로 클릭이 아닌 더블클릭 이벤트로 연결하고 co..

728x90