teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

4

追加

2021/12/27 09:07

投稿

aot
aot

スコア1

title CHANGED
File without changes
body CHANGED
@@ -51,4 +51,6 @@
51
51
 
52
52
  add_action('init', 'load_script');
53
53
  ?>
54
- ```
54
+ ```
55
+ ![イメージ説明](3f6f78e700e8614eab713c0acfb31444.png)
56
+ ![イメージ説明](5fd87cf133e1076792facd652105bf02.png)

3

文法修正

2021/12/27 09:07

投稿

aot
aot

スコア1

title CHANGED
File without changes
body CHANGED
@@ -1,11 +1,12 @@
1
1
  ポートフォリオサイトのWordPress化を行っているのですが、functions.phpでのcssとJavaScript、jQueryの読み込みが上手くできません。
2
2
  独自のcssとmain.jsは出来ていると思うのですが、slickやjQueryのプラグイン、googleフォント等の読み込み方を教えてください。
3
3
  ```css
4
- <link rel="stylesheet" href="css/reset.css" />
4
+ <link rel="stylesheet" href="css/reset.css" />
5
- <link rel="stylesheet" href="slick/slick.css"/>
5
+ <link rel="stylesheet" href="slick/slick.css"/>
6
- <link rel="stylesheet" href="css/style.css" media="all" />
6
+ <link rel="stylesheet" href="css/style.css" media="all" />
7
- <link href="https://fonts.googleapis.com/css2?family=Cuprum:wght@700&display=swap" rel="stylesheet">
7
+ <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500&display=swap" rel="stylesheet">
8
+ <link href="https://fonts.googleapis.com/css2?family=Cuprum:ital,wght@1,500&family=Noto+Sans+JP:wght@500&display=swap" rel="stylesheet">
8
- <link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
9
+ <link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
9
10
  ```
10
11
 
11
12
  ```JavaScript
@@ -29,12 +30,12 @@
29
30
  // reset.css
30
31
  wp_enqueue_style( 'reset', get_template_directory_uri() . '/css/reset.css' );
31
32
  // slick.css
32
-
33
+ wp_enqueue_style( 'slick', get_template_directory_uri() . '/slick/slick.css' );
33
34
  // style.css
34
35
  wp_enqueue_style( 'main', get_template_directory_uri() . '/css/style.css' );
35
36
  // google font
37
+
36
38
 
37
-
38
39
  // jquery.min.js
39
40
  wp_enqueue_script('jquery.min.js', 'https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js', array('jquery'), '3.4.1', false);
40
41
  // slick.js
@@ -49,4 +50,5 @@
49
50
  }
50
51
 
51
52
  add_action('init', 'load_script');
53
+ ?>
52
54
  ```

2

文法修正

2021/12/27 08:10

投稿

aot
aot

スコア1

title CHANGED
@@ -1,1 +1,1 @@
1
- function.phpでのcss・js読み込みについて
1
+ functions.phpでのcss・js読み込みについて
body CHANGED
@@ -1,4 +1,4 @@
1
- ポートフォリオサイトのWordPress化を行っているのですが、function.phpでのcssとJavaScript、jQueryの読み込みが上手くできません。
1
+ ポートフォリオサイトのWordPress化を行っているのですが、functions.phpでのcssとJavaScript、jQueryの読み込みが上手くできません。
2
2
  独自のcssとmain.jsは出来ていると思うのですが、slickやjQueryのプラグイン、googleフォント等の読み込み方を教えてください。
3
3
  ```css
4
4
  <link rel="stylesheet" href="css/reset.css" />
@@ -16,6 +16,7 @@
16
16
  <script src="js/main.js"></script>
17
17
  ```
18
18
 
19
+ functions.php
19
20
  ```php
20
21
  <?php
21
22
 
@@ -32,22 +33,20 @@
32
33
  // style.css
33
34
  wp_enqueue_style( 'main', get_template_directory_uri() . '/css/style.css' );
34
35
  // google font
36
+
37
+
38
+ // jquery.min.js
35
- wp_register_style( 'googleFonts','https://fonts.googleapis.com/css2?family=Cuprum:wght@700&display=swap');
39
+ wp_enqueue_script('jquery.min.js', 'https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js', array('jquery'), '3.4.1', false);
40
+ // slick.js
41
+ wp_enqueue_script( 'slick.js', get_template_directory_uri() . '/slick/slick.js', array('jquery'), false, true );
42
+ // gsap.min.js
43
+ wp_enqueue_script('gsap.min.js', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.1/gsap.min.js', array('jquery'), '3.6.1', false);
36
- wp_enqueue_style( 'googleFonts');
44
+ //ScrollTrigger.min.js
45
+ wp_enqueue_script('ScrollTrigger.min.js', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.1/ScrollTrigger.min.js', array('jquery'), '3.6.1', false);
37
46
  // main.js
38
47
  wp_enqueue_script( 'main-script', get_template_directory_uri() . '/js/main.js', array('jquery'), false, true );
39
- // slick.js
40
-
41
- // JavaScript
42
-
43
- // jQuery
44
-
45
48
  }
46
49
  }
47
50
 
48
51
  add_action('init', 'load_script');
49
- add_action('wp_enqueue_scripts', 'custom_add_google_fonts');
50
- add_action( 'wp_enqueue_scripts', 'add_google_fonts' );
51
-
52
- ?>
53
52
  ```

1

文法修正

2021/12/27 07:29

投稿

aot
aot

スコア1

title CHANGED
@@ -1,1 +1,1 @@
1
- HTMLWordPress化について
1
+ function.phpでcss・js読み込みについて
body CHANGED
@@ -19,16 +19,21 @@
19
19
  ```php
20
20
  <?php
21
21
 
22
+ add_theme_support('title-tag');
23
+ add_theme_support('post-thumbnails');
24
+
22
25
  function load_script() {
23
26
  if ( !is_admin() ) {
24
27
 
25
28
  // reset.css
26
29
  wp_enqueue_style( 'reset', get_template_directory_uri() . '/css/reset.css' );
27
30
  // slick.css
28
-
31
+
29
32
  // style.css
30
33
  wp_enqueue_style( 'main', get_template_directory_uri() . '/css/style.css' );
31
-
34
+ // google font
35
+ wp_register_style( 'googleFonts','https://fonts.googleapis.com/css2?family=Cuprum:wght@700&display=swap');
36
+ wp_enqueue_style( 'googleFonts');
32
37
  // main.js
33
38
  wp_enqueue_script( 'main-script', get_template_directory_uri() . '/js/main.js', array('jquery'), false, true );
34
39
  // slick.js
@@ -41,4 +46,8 @@
41
46
  }
42
47
 
43
48
  add_action('init', 'load_script');
49
+ add_action('wp_enqueue_scripts', 'custom_add_google_fonts');
50
+ add_action( 'wp_enqueue_scripts', 'add_google_fonts' );
51
+
52
+ ?>
44
53
  ```