{"id":10707,"date":"2026-01-29T19:31:03","date_gmt":"2026-01-29T10:31:03","guid":{"rendered":"https:\/\/code-plus.jp\/gp\/?page_id=10707"},"modified":"2026-06-02T17:41:57","modified_gmt":"2026-06-02T08:41:57","slug":"rss-portal","status":"publish","type":"page","link":"https:\/\/code-plus.jp\/gp\/rss-portal\/","title":{"rendered":"PICKS"},"content":{"rendered":"<!-- \u0f3b\u273f\ud835\udc0f\ud835\udc00\ud835\udc06\ud835\udc04\u0f3a -->\r\n<div class=\"pg-sarafrnt4efa\">\r\n\r\n  <!-- \u0f3b\u00a7\ud835\udc12\ud835\udc04\ud835\udc02\ud835\udc13\ud835\udc08\ud835\udc0e\ud835\udc0d\u0f3a -->\r\n  <section class=\"sect-frnt4efA-Picks\" style=\"contain-intrinsic-size:1000px;\">\r\n    <div class=\"section__interior mx-auto\">\r\n      <div class=\"hgroup-wrapper mb-0.5r\">\r\n        <h2 lang=\"en-GP\" class=\"fz-xxxol fw-600 hdg-chapter tlt-fadeInBottom\"><span style=\"visibility:hidden;\">PICKS<\/span><\/h2>\r\n      <\/div><!-- \/\/\/.hgroup -->\r\n\r\n      <div class=\"gadget-wrapper\">\r\n        <div><script>\n(function() {\nconst STYLE = document.createElement('style');\nSTYLE.textContent = `\n#rss-portal {\n\tmargin-inline: auto;\n}\n\n\/* \u2756Pattern\n\u0f3b\u2767\u22b0\u27e1\u22b1\u0f36\u22b0\u27e1\u22b1\u0f36\u22b0\u27e1\u22b1\u0f36\u2740\u0f36\u22b0\u27e1\u22b1\u0f36\u22b0\u27e1\u22b1\u0f36\u22b0\u27e1\u22b1\u0f36\u2619\u0f3a *\/\n\/* .rss-wrapper\uff08flex\uff0f\u6a2a\u7d44\u307f\uff09\n\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 \u0f1a\u0f36\u22b0\u27e1\u22b1\u0f36\u0f1a\u0f3a *\/\n#rss-portal .rss-wrapper {\n\tposition: relative;\n\twidth: 100%;\n}\n\n\/* .shelf_pc(@SP)  *\/\n@media screen and (max-width: 743.9px) {\n\t#rss-portal .rss-wrapper {\n\t\t\/* Flex *\/\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\tflex-wrap: wrap;\n\t}\n\n\t#rss-portal .rss-wrapper>:is(li, dd) {\n\t\twidth: 100%;\n\t}\n\n\t#rss-portal .rss-wrapper>:is(li, dd):nth-of-type(n+2) {\n\t\tmargin-top: 1rem;\n\t}\n}\n\n\/* .shelf(@PC)  *\/\n@media print,\nscreen and (min-width: 744px) {\n\t#rss-portal .rss-wrapper {\n\t\t\/* Flex *\/\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\tflex-wrap: wrap;\n\t}\n\n\t#rss-portal .rss-wrapper:is([data-cols=\"2\"], [data-cols_pc=\"2\"])>:is(li, dd) {\n\t\twidth: 48.6%;\n\t}\n\n\t#rss-portal .rss-wrapper:is([data-cols=\"3\"], [data-cols_pc=\"3\"])>:is(li, dd) {\n\t\twidth: 31.5%;\n\t}\n\n\t#rss-portal .rss-wrapper:is([data-cols=\"2\"], [data-cols_pc=\"2\"])>:is(li, dd):nth-of-type(n+3),\n\t#rss-portal .rss-wrapper:is([data-cols=\"3\"], [data-cols_pc=\"3\"])>:is(li, dd):nth-of-type(n+4) {\n\t\tmargin-top: 1rem;\n\t}\n}\n\n#rss-portal .rss-slide {\n\t\/* padding  \u7e26  \u6a2a *\/\n\tpadding: calc(var(--\u215dfem) * 1) calc(var(--\u215dfem) * 1.5);\n\tborder-radius: 0.5rem;\n\tbackground: #fff;\n}\n\n#rss-portal .rss-title {\n\tfont-size: clamp(1rem, calc(1rem + ((1vw - 0.225rem) * 0.4688)), 1.1375rem);\n\tfont-weight: 500;\n}\n\n#rss-portal .rss-meta-fields {\n\tline-height: 1.11;\n\tfont-size: 0.8125rem;\n\tcolor: var(--c-text-400, hsl(224, 6%, 63%));\n}\n\n#rss-portal .rss-score {\n\tpadding-block: 0px 1px;\n\tpadding-inline: 0.3em 0.4em;\n\tborder-radius: 0.25rem;\n\tcolor: #FFF;\n}\n\n#rss-portal .rss-score-1 {\n\tbackground: hsl(358, 83%, 53%);\n}\n\n#rss-portal .rss-score-2 {\n\tbackground: hsl(32, 93%, 53%);\n}\n\n#rss-portal .rss-score-3 {\n\tbackground: hsl(48, 98%, 53%);\n}\n\n#rss-portal .rss-score-4 {\n\tbackground: hsl(72, 63%, 53%);\n}\n\n#rss-portal .rss-score-5 {\n\tbackground: hsl(121, 44%, 53%);\n}\n\n#rss-portal .rss-score::before {\n\tposition: relative;\n\ttop: 0px;\n\tdisplay: inline-flex;\n\tvertical-align: -0.25em;\n\tplace-content: center;\n\tplace-items: center;\n\twidth: 0.75em;\n\tfont-size: 155.3%;\n\tfont-family: 'Material Symbols Sharp';\n\tfont-variation-settings: 'FILL' 0,\n\t\t'wght' 100;\n\tcontent: \"\\\\e838\";\n}\n\n#rss-portal .rss-summary {\n\tposition: relative;\n\tmin-height: 3.6em;\n\tfont-size: 0.7rem;\n\tcolor: var(--c-text-600, hsl(224, 6%, 43%));\n}\n\n#rss-portal .rss-feedback {\n\tposition: absolute;\n\tz-index: 10;\n\tbottom: -0.3rem;\n\tright: 0;\n\tmargin: auto;\n\tborder-radius: 0.25rem;\n\toverflow: hidden;\n}\n\n#rss-portal .rss-feedback .btn-like,\n#rss-portal .rss-feedback .btn-dislike {\n\tpadding-inline: 0.75rem;\n\tfont-size: 12px;\n\tbackground: var(--c-base-100, hsl(224, 6%, 93%));\n\tcolor: var(--c-text-400, hsl(224, 6%, 63%));\n}\n\n\/* :hover *\/\n@media (any-hover: hover) {\n\n\t#rss-portal .rss-feedback .btn-like:hover,\n\t#rss-portal .rss-feedback .btn-dislike:hover {\n\t\tbackground: var(--c-base-150, hsl(224, 6%, 89%));\n\t\topacity: 1;\n\t}\n}\n\n#rss-portal .rss-feedback .btn-like::before,\n#rss-portal .rss-feedback .btn-dislike::before {\n\tposition: relative;\n\ttop: 0px;\n\tdisplay: inline-flex;\n\tvertical-align: -0.35em;\n\tplace-content: center;\n\tplace-items: center;\n\twidth: 0.75em;\n\tfont-size: 173.3%;\n\tfont-family: 'Material Symbols Sharp';\n\tfont-variation-settings: 'FILL' 0,\n\t\t'wght' 300;\n}\n\n#rss-portal .rss-feedback .btn-like::before {\n\tleft: 0.0625em;\n\tcontent: \"\\\\e8dc\";\n}\n\n#rss-portal .rss-feedback .btn-dislike::before {\n\tright: 0.0625em;\n\tcontent: \"\\\\e8db\";\n}\n\n#rss-portal .rss-feedback .btn-like.is-liked {\n\tbackground: var(--c-linkage-300, hsl(240, 73%, 74%));\n\tcolor: #FFF;\n}\n\n#rss-portal .rss-feedback .btn-like.is-disliked {\n\tbackground: var(--c-error-300, hsl(352, 99%, 74%));\n\tcolor: #FFF;\n}\n`;\ndocument.getElementsByTagName('head')[0].appendChild(STYLE);\n})();\n<\/script>\n\n<div id=\"rss-portal\" class=\"rss-container\">\n  <div id=\"rss-loading\">\u8aad\u307f\u8fbc\u307f\u4e2d...<\/div>\n  <ul id=\"rss-wrapper\" class=\"rss-wrapper\" data-cols_pc=\"2\"><\/ul>\n<\/div>\n\n<script>\n  (function() {\n    const RSS_API_URL = '\/api\/rss-portal';\n\n    \/\/ \u30ed\u30fc\u30ab\u30eb\u30b9\u30c8\u30ec\u30fc\u30b8\u304b\u3089\u975e\u8868\u793a\u30ea\u30b9\u30c8\u3092\u53d6\u5f97\n    function getHiddenArticles() {\n      try {\n        const hidden = localStorage.getItem('rss-portal-hidden');\n        return hidden ? JSON.parse(hidden) : [];\n      } catch (e) {\n        localStorage.removeItem('rss-portal-hidden');\n        return [];\n      }\n    }\n\n    \/\/ \u8a18\u4e8b\u3092\u975e\u8868\u793a\u30ea\u30b9\u30c8\u306b\u8ffd\u52a0\n    function hideArticle(articleId) {\n      const hidden = getHiddenArticles();\n      if (!hidden.includes(articleId)) {\n        hidden.push(articleId);\n        localStorage.setItem('rss-portal-hidden', JSON.stringify(hidden));\n      }\n    }\n\n    \/\/ Like\u3057\u305f\u8a18\u4e8b\u3092\u8a18\u9332\n    function getLikedArticles() {\n      try {\n        const liked = localStorage.getItem('rss-portal-liked');\n        return liked ? JSON.parse(liked) : [];\n      } catch (e) {\n        localStorage.removeItem('rss-portal-liked');\n        return [];\n      }\n    }\n\n    function markAsLiked(articleId) {\n      const liked = getLikedArticles();\n      if (!liked.includes(articleId)) {\n        liked.push(articleId);\n        localStorage.setItem('rss-portal-liked', JSON.stringify(liked));\n      }\n    }\n\n    fetch(RSS_API_URL + '\/articles')\n      .then(res => {\n        if (!res.ok) throw new Error(res.status + ' ' + res.statusText);\n        return res.json();\n      })\n      .then(data => {\n        document.getElementById('rss-loading').style.display = 'none';\n        const wrapper = document.getElementById('rss-wrapper');\n        const hiddenArticles = getHiddenArticles();\n        const likedArticles = getLikedArticles();\n\n          data.articles.forEach(article => {\n\n          \/\/ \u975e\u8868\u793a\u30ea\u30b9\u30c8\u306b\u3042\u308b\u8a18\u4e8b\u306f\u30b9\u30ad\u30c3\u30d7\n          if (hiddenArticles.includes(article.id)) {\n            return;\n          }\n\n          const isLiked = likedArticles.includes(article.id);\n          const rssDate = new Date(article.published_at).toISOString().split('T')[0];\n\n          const li = document.createElement('li');\n          li.className = 'rss-slide';\n          li.id = 'article-' + article.id;\n\n          const h4 = document.createElement('h4');\n          h4.className = 'rss-title';\n          const titleLink = document.createElement('a');\n          titleLink.href = article.link;\n          titleLink.target = '_blank';\n          titleLink.textContent = article.title;\n          titleLink.addEventListener('click', function() { trackClick(article.id); });\n          h4.appendChild(titleLink);\n\n          const metaDiv = document.createElement('div');\n          metaDiv.className = 'rss-meta-fields';\n          const timeEl = document.createElement('time');\n          timeEl.className = 'rss-date';\n          timeEl.setAttribute('datetime', article.published_at);\n          timeEl.textContent = rssDate;\n          const feedSpan = document.createElement('span');\n          feedSpan.className = 'rss-feedname';\n          feedSpan.textContent = article.feed_name;\n          const scoreSpan = document.createElement('span');\n          scoreSpan.className = 'rss-score rss-score-' + article.score;\n          scoreSpan.textContent = article.score;\n          metaDiv.appendChild(timeEl);\n          metaDiv.appendChild(document.createTextNode(' | '));\n          metaDiv.appendChild(feedSpan);\n          metaDiv.appendChild(document.createTextNode(' '));\n          metaDiv.appendChild(scoreSpan);\n\n          const summaryP = document.createElement('p');\n          summaryP.className = 'rss-summary';\n          summaryP.appendChild(document.createTextNode(article.score_summary || article.summary || ''));\n          const feedbackLabel = document.createElement('label');\n          feedbackLabel.className = 'rss-feedback';\n          const btnLike = document.createElement('a');\n          btnLike.className = 'btn-like' + (isLiked ? ' is-liked' : '');\n          btnLike.textContent = isLiked ? '' : '';\n          btnLike.addEventListener('click', function() { sendFeedback(article.id, 'like', this); });\n          const btnDislike = document.createElement('a');\n          btnDislike.className = 'btn-dislike';\n          btnDislike.textContent = '';\n          btnDislike.addEventListener('click', function() { sendFeedback(article.id, 'dislike', this); });\n          feedbackLabel.appendChild(btnLike);\n          feedbackLabel.appendChild(btnDislike);\n          summaryP.appendChild(feedbackLabel);\n\n          li.appendChild(h4);\n          li.appendChild(metaDiv);\n          li.appendChild(summaryP);\n          wrapper.appendChild(li);\n        });\n      })\n      .catch(err => {\n        document.getElementById('rss-loading').textContent = '\u30a8\u30e9\u30fc\u304c\u767a\u751f\u3057\u307e\u3057\u305f';\n        console.error(err);\n      });\n\n    \/\/\u30af\u30ea\u30c3\u30af\u8ffd\u8de1\u95a2\u6570\n    function trackClick(articleId) {\n      fetch('\/api\/rss-portal\/feedback', {\n        method: 'POST',\n        headers: {\n          'Content-Type': 'application\/json'\n        },\n        body: JSON.stringify({\n          article_id: articleId,\n          feedback: 'click'\n        })\n      });\n    }\n\n    function sendFeedback(articleId, type, button) {\n      const prevButtonClass = button.className;\n      const prevButtonText = button.textContent;\n\n      fetch('\/api\/rss-portal\/feedback', {\n        method: 'POST',\n        headers: {\n          'Content-Type': 'application\/json'\n        },\n        body: JSON.stringify({\n          article_id: articleId,\n          feedback: type\n        })\n      }).then(res => {\n        if (!res.ok) throw new Error(res.status + ' ' + res.statusText);\n        if (type === 'like') {\n          const likedList = getLikedArticles();\n          if (!likedList.includes(articleId)) {\n            likedList.push(articleId);\n            localStorage.setItem('rss-portal-liked', JSON.stringify(likedList));\n          }\n          button.classList.add('is-liked');\n          button.textContent = '';\n        } else {\n          const hiddenList = getHiddenArticles();\n          if (!hiddenList.includes(articleId)) {\n            hiddenList.push(articleId);\n            localStorage.setItem('rss-portal-hidden', JSON.stringify(hiddenList));\n          }\n          const articleDiv = document.getElementById('article-' + articleId);\n          if (articleDiv) {\n            articleDiv.style.transition = 'opacity 0.3s';\n            articleDiv.style.opacity = '0';\n            setTimeout(() => articleDiv.remove(), 300);\n          }\n        }\n      }).catch(err => {\n        console.error('Feedback failed:', err);\n        button.className = prevButtonClass;\n        button.textContent = prevButtonText;\n        if (type === 'dislike') {\n          const articleDiv = document.getElementById('article-' + articleId);\n          if (articleDiv) {\n            articleDiv.style.opacity = '1';\n          }\n        }\n        if (type === 'like') {\n          const likedList = getLikedArticles().filter(id => id !== articleId);\n          localStorage.setItem('rss-portal-liked', JSON.stringify(likedList));\n        } else {\n          const hiddenList = getHiddenArticles().filter(id => id !== articleId);\n          localStorage.setItem('rss-portal-hidden', JSON.stringify(hiddenList));\n        }\n      });\n    }\n\n  })();\n<\/script><\/div>\r\n      <\/div><!-- \/\/\/.gadget -->\r\n    <\/div><!-- \/\/\/.interior -->\r\n  <\/section>\r\n\r\n<\/div><!-- \/\/\/.page -->","protected":false},"excerpt":{"rendered":"PICKS","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":3,"comment_status":"closed","ping_status":"closed","template":"","meta":{"sns_share_botton_hide":"","vkExUnit_sns_title":"","_vk_print_noindex":"","_exclude_from_list_pages":"","footnotes":"","vk-ltc-link":"","vk-ltc-target":"0"},"categories":[],"tags":[],"class_list":["post-10707","page","type-page","status-publish"],"veu_head_title_object":{"title":"","add_site_title":""},"_links":{"self":[{"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/pages\/10707","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/comments?post=10707"}],"version-history":[{"count":1,"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/pages\/10707\/revisions"}],"predecessor-version":[{"id":12562,"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/pages\/10707\/revisions\/12562"}],"wp:attachment":[{"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/media?parent=10707"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/categories?post=10707"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/code-plus.jp\/gp\/wp-json\/wp\/v2\/tags?post=10707"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}