{"id":93,"date":"2020-03-05T02:45:35","date_gmt":"2020-03-04T19:45:35","guid":{"rendered":"http:\/\/www.onairhatyai.com\/?page_id=93"},"modified":"2026-04-27T19:06:47","modified_gmt":"2026-04-27T12:06:47","slug":"%e0%b8%9f%e0%b8%b1%e0%b8%87-%e0%b8%94%e0%b8%99%e0%b8%95%e0%b8%a3%e0%b8%b5%e0%b8%aa%e0%b8%b5%e0%b8%aa%e0%b8%b1%e0%b8%99-%e0%b9%84%e0%b8%94%e0%b9%89%e0%b8%97%e0%b8%b5%e0%b9%88%e0%b8%99%e0%b8%b5%e0%b9%88","status":"publish","type":"page","link":"https:\/\/onairhatyai.com\/","title":{"rendered":"\u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19 FM 89.5 \u0e40\u0e1e\u0e25\u0e07\u0e40\u0e1e\u0e23\u0e32\u0e30\u0e17\u0e31\u0e49\u0e07\u0e27\u0e31\u0e19 \u0e1f\u0e31\u0e07\u0e44\u0e14\u0e49\u0e17\u0e31\u0e49\u0e07\u0e04\u0e37\u0e19"},"content":{"rendered":"\n<h1 class=\"wp-block-heading has-text-align-center has-black-color has-text-color has-link-color wp-elements-74bc0a294a205cd40687bb5aa5a04e80\">34 \u0e1b\u0e35 \u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e27\u0e34\u0e17\u0e22\u0e38 &#8220;\u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19&#8221; \u0e17\u0e35\u0e48\u0e2d\u0e2d\u0e01\u0e2d\u0e32\u0e01\u0e32\u0e28\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e15\u0e48\u0e2d\u0e40\u0e19\u0e37\u0e48\u0e2d\u0e07\u0e15\u0e25\u0e2d\u0e14 <br>\u0e15\u0e31\u0e49\u0e07\u0e41\u0e15\u0e48 \u0e1e.\u0e28.2535 \u0e40\u0e1b\u0e47\u0e19\u0e15\u0e49\u0e19\u0e21\u0e32<\/h1>\n\n\n\t\t<div id=\"serious-slider-31-rnd2492\" class=\"cryout-serious-slider seriousslider serious-slider-31-rnd2492 serious-slider-31 seriousslider-overlay1 seriousslider-light seriousslider-shadow-none seriousslider-responsive-maintain seriousslider-hidetitles-1 seriousslider-slide seriousslider-sizing0 seriousslider-aligncenter seriousslider-caption-animation-slide seriousslider-textstyle-textshadow\" data-ride=\"seriousslider\">\n\t\t\t<div class=\"seriousslider-inner\" role=\"listbox\">\n\n\t\t\t\n\t\t\t<div class=\"item slide-1 active\" role=\"option\">\n\t\t\t\t\t\t\t\t<a  >\n\t\t\t\t\t<img decoding=\"async\" class=\"item-image\" src=\"https:\/\/onairhatyai.com\/wp-content\/uploads\/2023\/01\/324556272_617043116770568_6142634722006315917_n.png\" alt=\"\u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19 \u0e2b\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48 \u0e2a\u0e07\u0e02\u0e25\u0e32\" >\n\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"seriousslider-caption\">\n\t\t\t\t\t<div class=\"seriousslider-caption-inside\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"seriousslider-caption-buttons\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div><!--seriousslider-caption-inside-->\n\t\t\t\t<\/div><!--seriousslider-caption-->\n\t\t\t\t\t\t\t\t<div class=\"seriousslider-hloader\"><\/div>\n\t\t\t\t<figure class=\"seriousslider-cloader\">\n\t\t\t\t\t<svg width=\"200\" height=\"200\">\n\t\t\t\t\t\t<circle cx=\"95\" cy=\"95\" r=\"20\" transform=\"rotate(-90, 95, 95)\"\/>\n\t\t\t\t\t<\/svg>\n\t\t\t  <\/figure>\n\t\t\t<\/div>\n\n\t\t\t\t\t\t<\/div>\n\n\t\t\t<div class=\"seriousslider-indicators\">\n\t\t\t\t<ol class=\"seriousslider-indicators-inside\">\n\t\t\t\t\t\t\t\t\t\t<li data-target=\"#serious-slider-31\" data-slide-to=\"0\" class=\"active\"><\/li>\n\t\t\t\t\t\t\t\t\t<\/ol>\n\t\t\t<\/div>\n\n\t\t\t<button class=\"left seriousslider-control\" data-target=\"#serious-slider-31-rnd2492\" role=\"button\" data-slide=\"prev\">\n\t\t\t  <span class=\"sicon-prev control-arrow\" aria-hidden=\"true\"><\/span>\n\t\t\t  <span class=\"sr-only\">Previous Slide<\/span>\n\t\t\t<\/button>\n\t\t\t<button class=\"right seriousslider-control\" data-target=\"#serious-slider-31-rnd2492\" role=\"button\" data-slide=\"next\">\n\t\t\t  <span class=\"sicon-next control-arrow\" aria-hidden=\"true\"><\/span>\n\t\t\t  <span class=\"sr-only\">Next Slide<\/span>\n\t\t\t<\/button>\n\t\t<\/div>\n\t\t\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<section class=\"radio-banner-container-single\">\n    <style>\n        \/* ================================================= *\/\n        \/* === Styles for Single Fanpage Banner (Easy Listening) === *\/\n        \/* ================================================= *\/\n\n        \/* Font Import (Kanit) *\/\n        @import url('https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;700&display=swap');\n\n        :root {\n            \/* \u0e2a\u0e35 Gradient \u0e2a\u0e14\u0e43\u0e2a\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 (\u0e42\u0e17\u0e19\u0e1f\u0e49\u0e32-\u0e21\u0e48\u0e27\u0e07) *\/\n            --gradient-1: linear-gradient(135deg, #1877F2, #4c66ff, #ff69b4);\n            \/* \u0e2a\u0e35\u0e2b\u0e25\u0e31\u0e01\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e40\u0e19\u0e49\u0e19\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21 *\/\n            --primary-text-color: #ffffff;\n        }\n        \n        \/* Container \u0e2b\u0e25\u0e31\u0e01 (\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e08\u0e31\u0e14\u0e43\u0e2b\u0e49\u0e2d\u0e22\u0e39\u0e48\u0e15\u0e23\u0e07\u0e01\u0e25\u0e32\u0e07 \u0e2b\u0e32\u0e01\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23) *\/\n        .radio-banner-container-single {\n            font-family: 'Kanit', sans-serif;\n            padding: 15px 0;\n            margin: 0 auto;\n            max-width: 500px; \/* \u0e08\u0e33\u0e01\u0e31\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e41\u0e1a\u0e19\u0e40\u0e19\u0e2d\u0e23\u0e4c\u0e40\u0e14\u0e35\u0e22\u0e27 *\/\n            box-sizing: border-box;\n            text-align: center;\n        }\n\n        \/* Style \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a Banner Item *\/\n        .banner-item {\n            display: inline-flex; \/* \u0e43\u0e0a\u0e49 inline-flex \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e01\u0e27\u0e49\u0e32\u0e07\u0e40\u0e17\u0e48\u0e32\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32 \u0e41\u0e25\u0e30\u0e08\u0e31\u0e14\u0e40\u0e23\u0e35\u0e22\u0e07\u0e20\u0e32\u0e22\u0e43\u0e19 *\/\n            width: 100%;\n            min-height: 100px;\n            aspect-ratio: 4 \/ 1; \/* \u0e2d\u0e31\u0e15\u0e23\u0e32\u0e2a\u0e48\u0e27\u0e19 4:1 \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e41\u0e1a\u0e19\u0e40\u0e19\u0e2d\u0e23\u0e4c\u0e41\u0e19\u0e27\u0e19\u0e2d\u0e19\u0e40\u0e25\u0e47\u0e01 *\/\n            background: var(--gradient-1);\n            background-size: 300% 300%;\n            animation: gradient-shift 15s ease infinite;\n            border-radius: 12px;\n            color: var(--primary-text-color);\n            align-items: center;\n            justify-content: center; \/* \u0e08\u0e31\u0e14\u0e43\u0e2b\u0e49\u0e2d\u0e22\u0e39\u0e48\u0e15\u0e23\u0e07\u0e01\u0e25\u0e32\u0e07\u0e21\u0e32\u0e01\u0e02\u0e36\u0e49\u0e19 *\/\n            padding: 15px 20px;\n            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);\n            transition: transform 0.3s, box-shadow 0.3s;\n            cursor: pointer;\n            overflow: hidden;\n            position: relative;\n            text-decoration: none; \n            z-index: 1;\n        }\n\n        .banner-item:hover {\n            transform: translateY(-4px);\n            box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);\n        }\n\n        \/* Animation \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 Gradient *\/\n        @keyframes gradient-shift {\n            0% {background-position: 0% 50%;}\n            50% {background-position: 100% 50%;}\n            100% {background-position: 0% 50%;}\n        }\n\n        \/* Icon Container *\/\n        .banner-icon-wrapper {\n            font-size: 38px;\n            margin-right: 15px;\n            min-width: 45px;\n            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            z-index: 2;\n        }\n\n        \/* Text Content *\/\n        .banner-content {\n            flex-grow: 1;\n            text-align: left;\n            z-index: 2;\n            text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);\n        }\n\n        .banner-text-small {\n            font-size: 0.9em;\n            font-weight: 400;\n            opacity: 0.9;\n            margin-bottom: 2px;\n            display: block;\n        }\n\n        .banner-text-main {\n            font-size: 1.5em; \/* \u0e17\u0e33\u0e43\u0e2b\u0e49\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e2b\u0e25\u0e31\u0e01\u0e43\u0e2b\u0e0d\u0e48\u0e41\u0e25\u0e30\u0e40\u0e14\u0e48\u0e19 *\/\n            font-weight: 700;\n            line-height: 1.2;\n            display: block;\n            text-transform: uppercase;\n        }\n\n        \/* Decorative Elements (\u0e25\u0e39\u0e01\u0e40\u0e25\u0e48\u0e19) *\/\n        .banner-item::before {\n            content: \"\";\n            position: absolute;\n            top: -50%;\n            right: -50%;\n            width: 150%;\n            height: 150%;\n            background: rgba(255, 255, 255, 0.1);\n            transform: rotate(30deg);\n            pointer-events: none;\n            z-index: 0;\n            border-radius: 10px;\n        }\n\n        \/* Icon Adjustments *\/\n        .fa-facebook-f {\n            color: #1877F2; \/* \u0e2a\u0e35\u0e1f\u0e49\u0e32 Facebook *\/\n            background-color: white;\n            padding: 5px;\n            border-radius: 50%;\n            font-size: 28px;\n            box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);\n        }\n        \n        @media (max-width: 600px) {\n            .banner-text-main {\n                font-size: 1.2em; \/* \u0e25\u0e14\u0e02\u0e19\u0e32\u0e14 font \u0e1a\u0e19\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d *\/\n            }\n        }\n\n    <\/style>\n\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\"> \n\n    <a href=\"#\" class=\"banner-item\" title=\"\u0e44\u0e1b\u0e17\u0e35\u0e48 Fanpage\">\n        <div class=\"banner-icon-wrapper\">\n            <i class=\"fa-brands fa-facebook-f\"><\/i>\n        <\/div>\n        <div class=\"banner-content\">\n            <span class=\"banner-text-small\">\u0e01\u0e14 Like \u0e41\u0e25\u0e30\u0e15\u0e34\u0e14\u0e15\u0e32\u0e21<\/span>\n            <span class=\"banner-text-main\">Fanpage \u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19\u0e2b\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48<\/span>\n        <\/div>\n    <\/a>\n<\/section>\n\n\n\n<div id=\"fb-root\"><\/div>\n<script async defer crossorigin=\"anonymous\" src=\"https:\/\/connect.facebook.net\/th_TH\/sdk.js#xfbml=1&#038;version=v19.0\" nonce=\"[RANDOM_STRING]\"><\/script>\n\n<div class=\"facebook-embed-wrapper\">\n    <style>\n        \/* ============================================== *\/\n        \/* === Custom Style for Facebook Page Embed (Full Width) === *\/\n        \/* ============================================== *\/\n\n        \/* Container \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e0a\u0e48\u0e27\u0e22\u0e43\u0e19\u0e01\u0e32\u0e23\u0e08\u0e31\u0e14\u0e23\u0e39\u0e1b\u0e41\u0e1a\u0e1a\u0e41\u0e25\u0e30\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e27\u0e22\u0e07\u0e32\u0e21 *\/\n        .facebook-embed-wrapper {\n            \/* \u0e17\u0e33\u0e43\u0e2b\u0e49 Container \u0e21\u0e35\u0e02\u0e2d\u0e1a\u0e21\u0e19\u0e41\u0e25\u0e30\u0e40\u0e07\u0e32\u0e40\u0e25\u0e47\u0e01\u0e19\u0e49\u0e2d\u0e22 *\/\n            border-radius: 12px;\n            overflow: hidden; \/* \u0e0b\u0e48\u0e2d\u0e19\u0e2a\u0e48\u0e27\u0e19\u0e17\u0e35\u0e48\u0e40\u0e01\u0e34\u0e19\u0e02\u0e2d\u0e1a\u0e21\u0e19 *\/\n            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);\n            \/* \u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e40\u0e15\u0e47\u0e21\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07\u0e1a\u0e25\u0e47\u0e2d\u0e01\u0e17\u0e35\u0e48\u0e42\u0e04\u0e49\u0e14\u0e19\u0e35\u0e49\u0e2d\u0e22\u0e39\u0e48 *\/\n            width: 100%; \n            margin: 20px 0; \/* \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e23\u0e30\u0e22\u0e30\u0e2b\u0e48\u0e32\u0e07\u0e14\u0e49\u0e32\u0e19\u0e1a\u0e19\/\u0e25\u0e48\u0e32\u0e07 *\/\n        }\n        \n        \/* Facebook Plugin Container: \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e2b\u0e25\u0e31\u0e01 *\/\n        .fb-page-container {\n            width: 100%; \n            min-height: 500px; \/* \u0e01\u0e33\u0e2b\u0e19\u0e14\u0e04\u0e27\u0e32\u0e21\u0e2a\u0e39\u0e07\u0e02\u0e31\u0e49\u0e19\u0e15\u0e48\u0e33\u0e17\u0e35\u0e48\u0e21\u0e2d\u0e07\u0e40\u0e2b\u0e47\u0e19\u0e44\u0e17\u0e21\u0e4c\u0e44\u0e25\u0e19\u0e4c *\/\n            overflow: hidden;\n        }\n\n        \/* Responsive Fix: \u0e41\u0e01\u0e49\u0e1b\u0e31\u0e0d\u0e2b\u0e32 Facebook Plugin \u0e44\u0e21\u0e48\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e40\u0e21\u0e37\u0e48\u0e2d\u0e21\u0e35\u0e01\u0e32\u0e23\u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e02\u0e19\u0e32\u0e14\u0e2b\u0e19\u0e49\u0e32\u0e08\u0e2d\u0e2b\u0e25\u0e31\u0e07\u0e42\u0e2b\u0e25\u0e14 *\/\n        \/* \u0e42\u0e04\u0e49\u0e14\u0e19\u0e35\u0e49\u0e08\u0e30\u0e0a\u0e48\u0e27\u0e22\u0e43\u0e2b\u0e49 FB Plugin \u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e49\u0e40\u0e15\u0e47\u0e21\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e02\u0e2d\u0e07 .facebook-embed-wrapper \u0e40\u0e2a\u0e21\u0e2d *\/\n        .fb-page {\n            width: 100% !important;\n            height: 100% !important;\n        }\n    <\/style>\n\n    <div class=\"fb-page-container\">\n        <div class=\"fb-page\" \n            data-href=\"https:\/\/www.facebook.com\/dontreeseasonhatyai\" \n            data-tabs=\"timeline\" \n            data-width=\"500\" \n            data-height=\"700\" \n            data-small-header=\"false\" \n            data-adapt-container-width=\"true\" \n            data-hide-cover=\"false\" \n            data-show-facepile=\"true\">\n            <blockquote cite=\"https:\/\/www.facebook.com\/dontreeseasonhatyai\" class=\"fb-xfbml-parse-ignore\">\n                <a href=\"https:\/\/www.facebook.com\/dontreeseasonhatyai\">\u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19\u0e2b\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48<\/a>\n            <\/blockquote>\n        <\/div>\n    <\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<section class=\"radio-banner-container-single\">\n    <style>\n        \/* ================================================= *\/\n        \/* === Styles for Single 24H Banner (Easy Listening) === *\/\n        \/* ================================================= *\/\n\n        \/* Font Import (Kanit) *\/\n        @import url('https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;700&display=swap');\n\n        :root {\n            \/* \u0e2a\u0e35 Gradient \u0e2a\u0e14\u0e43\u0e2a\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 (\u0e42\u0e17\u0e19\u0e0a\u0e21\u0e1e\u0e39-\u0e21\u0e48\u0e27\u0e07-\u0e1f\u0e49\u0e32) *\/\n            --gradient-3: linear-gradient(135deg, #ec4899, #8b5cf6, #3b82f6, #06b6d4);\n            \/* \u0e2a\u0e35\u0e2b\u0e25\u0e31\u0e01\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e40\u0e19\u0e49\u0e19\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21 *\/\n            --primary-text-color: #ffffff;\n        }\n        \n        \/* Container \u0e2b\u0e25\u0e31\u0e01 (\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e08\u0e31\u0e14\u0e43\u0e2b\u0e49\u0e2d\u0e22\u0e39\u0e48\u0e15\u0e23\u0e07\u0e01\u0e25\u0e32\u0e07 \u0e2b\u0e32\u0e01\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23) *\/\n        .radio-banner-container-single {\n            font-family: 'Kanit', sans-serif;\n            padding: 15px 0;\n            margin: 0 auto;\n            max-width: 500px; \/* \u0e08\u0e33\u0e01\u0e31\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e41\u0e1a\u0e19\u0e40\u0e19\u0e2d\u0e23\u0e4c\u0e40\u0e14\u0e35\u0e22\u0e27 *\/\n            box-sizing: border-box;\n            text-align: center;\n        }\n\n        \/* Style \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a Banner Item *\/\n        .banner-item {\n            display: inline-flex; \/* \u0e43\u0e0a\u0e49 inline-flex \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e01\u0e27\u0e49\u0e32\u0e07\u0e40\u0e17\u0e48\u0e32\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32 \u0e41\u0e25\u0e30\u0e08\u0e31\u0e14\u0e40\u0e23\u0e35\u0e22\u0e07\u0e20\u0e32\u0e22\u0e43\u0e19 *\/\n            width: 100%;\n            min-height: 100px;\n            aspect-ratio: 4 \/ 1; \/* \u0e2d\u0e31\u0e15\u0e23\u0e32\u0e2a\u0e48\u0e27\u0e19 4:1 \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e41\u0e1a\u0e19\u0e40\u0e19\u0e2d\u0e23\u0e4c\u0e41\u0e19\u0e27\u0e19\u0e2d\u0e19\u0e40\u0e25\u0e47\u0e01 *\/\n            background: var(--gradient-3);\n            background-size: 300% 300%;\n            animation: gradient-shift 15s ease infinite;\n            border-radius: 12px;\n            color: var(--primary-text-color);\n            align-items: center;\n            justify-content: center;\n            padding: 15px 20px;\n            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);\n            transition: transform 0.3s, box-shadow 0.3s;\n            cursor: pointer;\n            overflow: hidden;\n            position: relative;\n            text-decoration: none; \n            z-index: 1;\n        }\n\n        .banner-item:hover {\n            transform: translateY(-4px);\n            box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);\n        }\n\n        \/* Animation \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 Gradient *\/\n        @keyframes gradient-shift {\n            0% {background-position: 0% 50%;}\n            50% {background-position: 100% 50%;}\n            100% {background-position: 0% 50%;}\n        }\n\n        \/* Icon Container *\/\n        .banner-icon-wrapper {\n            font-size: 38px;\n            margin-right: 15px;\n            min-width: 45px;\n            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            z-index: 2;\n        }\n\n        \/* Text Content *\/\n        .banner-content {\n            flex-grow: 1;\n            text-align: left;\n            z-index: 2;\n            text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);\n        }\n\n        .banner-text-small {\n            font-size: 0.9em;\n            font-weight: 400;\n            opacity: 0.9;\n            margin-bottom: 2px;\n            display: block;\n        }\n\n        .banner-text-main {\n            font-size: 1.5em; \/* \u0e17\u0e33\u0e43\u0e2b\u0e49\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e2b\u0e25\u0e31\u0e01\u0e43\u0e2b\u0e0d\u0e48\u0e41\u0e25\u0e30\u0e40\u0e14\u0e48\u0e19 *\/\n            font-weight: 700;\n            line-height: 1.2;\n            display: block;\n            text-transform: uppercase;\n        }\n\n        \/* Decorative Elements (\u0e25\u0e39\u0e01\u0e40\u0e25\u0e48\u0e19) *\/\n        .banner-item::before {\n            content: \"\";\n            position: absolute;\n            top: -50%;\n            right: -50%;\n            width: 150%;\n            height: 150%;\n            background: rgba(255, 255, 255, 0.1);\n            transform: rotate(30deg);\n            pointer-events: none;\n            z-index: 0;\n            border-radius: 10px;\n        }\n\n        \/* Icon Adjustments *\/\n        .fa-clock {\n            color: #ffffff; \n            text-shadow: 0 0 8px rgba(255, 255, 255, 0.8); \/* Icon \u0e40\u0e23\u0e37\u0e2d\u0e07\u0e41\u0e2a\u0e07 *\/\n            animation: pulse-icon 2s infinite;\n        }\n        \n        @keyframes pulse-icon {\n            0% { opacity: 0.8; transform: scale(1); }\n            50% { opacity: 1; transform: scale(1.05); }\n            100% { opacity: 0.8; transform: scale(1); }\n        }\n        \n        @media (max-width: 600px) {\n            .banner-text-main {\n                font-size: 1.2em; \/* \u0e25\u0e14\u0e02\u0e19\u0e32\u0e14 font \u0e1a\u0e19\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d *\/\n            }\n        }\n\n    <\/style>\n\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\"> \n\n    <a href=\"#\" class=\"banner-item\" title=\"\u0e40\u0e1b\u0e34\u0e14\u0e1f\u0e31\u0e07\u0e44\u0e14\u0e49\u0e15\u0e25\u0e2d\u0e14 24 \u0e0a\u0e31\u0e48\u0e27\u0e42\u0e21\u0e07\">\n        <div class=\"banner-icon-wrapper\">\n            <i class=\"fa-solid fa-clock\"><\/i>\n        <\/div>\n        <div class=\"banner-content\">\n            <span class=\"banner-text-small\">\u0e40\u0e1e\u0e25\u0e07\u0e40\u0e1e\u0e23\u0e32\u0e30 Easy Listening<\/span>\n            <span class=\"banner-text-main\">\u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19\u0e2b\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48 24 \u0e0a\u0e31\u0e48\u0e27\u0e42\u0e21\u0e07<\/span>\n        <\/div>\n    <\/a>\n<\/section>\n\n\n\n<left>\n<iframe loading=\"lazy\" name=\"myiFrame\" width=\"500px\" height=\"715px\" src=\"https:\/\/radio.onair.one\/hatyai.php\" scrolling=\"no\" marginwidth=\"0\" marginheight=\"0\" style=\"border:none;\"><\/iframe><\/left>\n<p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<section class=\"radio-banner-container-single\">\n    <style>\n        \/* ================================================= *\/\n        \/* === Styles for Single PRD Songkhla Banner (Easy Listening) === *\/\n        \/* ================================================= *\/\n\n        \/* Font Import (Kanit) *\/\n        @import url('https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;700&display=swap');\n\n        :root {\n            \/* \u0e2a\u0e35 Gradient \u0e2a\u0e14\u0e43\u0e2a\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 (\u0e42\u0e17\u0e19\u0e40\u0e02\u0e35\u0e22\u0e27-\u0e2a\u0e49\u0e21-\u0e21\u0e48\u0e27\u0e07) *\/\n            --gradient-2: linear-gradient(135deg, #059669, #34d399, #f97316, #9333ea);\n            \/* \u0e2a\u0e35\u0e2b\u0e25\u0e31\u0e01\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e40\u0e19\u0e49\u0e19\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21 *\/\n            --primary-text-color: #ffffff;\n        }\n        \n        \/* Container \u0e2b\u0e25\u0e31\u0e01 (\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e08\u0e31\u0e14\u0e43\u0e2b\u0e49\u0e2d\u0e22\u0e39\u0e48\u0e15\u0e23\u0e07\u0e01\u0e25\u0e32\u0e07 \u0e2b\u0e32\u0e01\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e32\u0e23) *\/\n        .radio-banner-container-single {\n            font-family: 'Kanit', sans-serif;\n            padding: 15px 0;\n            margin: 0 auto;\n            max-width: 500px; \/* \u0e08\u0e33\u0e01\u0e31\u0e14\u0e04\u0e27\u0e32\u0e21\u0e01\u0e27\u0e49\u0e32\u0e07\u0e41\u0e1a\u0e19\u0e40\u0e19\u0e2d\u0e23\u0e4c\u0e40\u0e14\u0e35\u0e22\u0e27 *\/\n            box-sizing: border-box;\n            text-align: center;\n        }\n\n        \/* Style \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a Banner Item *\/\n        .banner-item {\n            display: inline-flex; \/* \u0e43\u0e0a\u0e49 inline-flex \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e01\u0e27\u0e49\u0e32\u0e07\u0e40\u0e17\u0e48\u0e32\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32 \u0e41\u0e25\u0e30\u0e08\u0e31\u0e14\u0e40\u0e23\u0e35\u0e22\u0e07\u0e20\u0e32\u0e22\u0e43\u0e19 *\/\n            width: 100%;\n            min-height: 100px;\n            aspect-ratio: 4 \/ 1; \/* \u0e2d\u0e31\u0e15\u0e23\u0e32\u0e2a\u0e48\u0e27\u0e19 4:1 \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e41\u0e1a\u0e19\u0e40\u0e19\u0e2d\u0e23\u0e4c\u0e41\u0e19\u0e27\u0e19\u0e2d\u0e19\u0e40\u0e25\u0e47\u0e01 *\/\n            background: var(--gradient-2);\n            background-size: 300% 300%;\n            animation: gradient-shift 15s ease infinite;\n            border-radius: 12px;\n            color: var(--primary-text-color);\n            align-items: center;\n            justify-content: center;\n            padding: 15px 20px;\n            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);\n            transition: transform 0.3s, box-shadow 0.3s;\n            cursor: pointer;\n            overflow: hidden;\n            position: relative;\n            text-decoration: none; \n            z-index: 1;\n        }\n\n        .banner-item:hover {\n            transform: translateY(-4px);\n            box-shadow: 0 6px 16px rgba(0, 0, 0, 0.35);\n        }\n\n        \/* Animation \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e1e\u0e37\u0e49\u0e19\u0e2b\u0e25\u0e31\u0e07 Gradient *\/\n        @keyframes gradient-shift {\n            0% {background-position: 0% 50%;}\n            50% {background-position: 100% 50%;}\n            100% {background-position: 0% 50%;}\n        }\n\n        \/* Icon Container *\/\n        .banner-icon-wrapper {\n            font-size: 38px;\n            margin-right: 15px;\n            min-width: 45px;\n            text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            z-index: 2;\n        }\n\n        \/* Text Content *\/\n        .banner-content {\n            flex-grow: 1;\n            text-align: left;\n            z-index: 2;\n            text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);\n        }\n\n        .banner-text-small {\n            font-size: 0.9em;\n            font-weight: 400;\n            opacity: 0.9;\n            margin-bottom: 2px;\n            display: block;\n        }\n\n        .banner-text-main {\n            font-size: 1.5em; \/* \u0e17\u0e33\u0e43\u0e2b\u0e49\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e2b\u0e25\u0e31\u0e01\u0e43\u0e2b\u0e0d\u0e48\u0e41\u0e25\u0e30\u0e40\u0e14\u0e48\u0e19 *\/\n            font-weight: 700;\n            line-height: 1.2;\n            display: block;\n            text-transform: uppercase;\n        }\n\n        \/* Decorative Elements (\u0e25\u0e39\u0e01\u0e40\u0e25\u0e48\u0e19) *\/\n        .banner-item::before {\n            content: \"\";\n            position: absolute;\n            top: -50%;\n            right: -50%;\n            width: 150%;\n            height: 150%;\n            background: rgba(255, 255, 255, 0.1);\n            transform: rotate(30deg);\n            pointer-events: none;\n            z-index: 0;\n            border-radius: 10px;\n        }\n\n        \/* Icon Adjustments *\/\n        .fa-wifi {\n            color: #ffffff; \n            text-shadow: 0 0 8px rgba(255, 255, 255, 0.8); \/* Icon \u0e40\u0e23\u0e37\u0e2d\u0e07\u0e41\u0e2a\u0e07 *\/\n            animation: pulse-icon 2s infinite;\n        }\n        \n        @keyframes pulse-icon {\n            0% { opacity: 0.8; transform: scale(1); }\n            50% { opacity: 1; transform: scale(1.05); }\n            100% { opacity: 0.8; transform: scale(1); }\n        }\n        \n        @media (max-width: 600px) {\n            .banner-text-main {\n                font-size: 1.2em; \/* \u0e25\u0e14\u0e02\u0e19\u0e32\u0e14 font \u0e1a\u0e19\u0e21\u0e37\u0e2d\u0e16\u0e37\u0e2d *\/\n            }\n        }\n\n    <\/style>\n\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\"> \n\n    <a href=\"#\" class=\"banner-item\" title=\"\u0e1f\u0e31\u0e07\u0e27\u0e34\u0e17\u0e22\u0e38\u0e2d\u0e2d\u0e19\u0e44\u0e25\u0e19\u0e4c\">\n        <div class=\"banner-icon-wrapper\">\n            <i class=\"fa-solid fa-wifi\"><\/i>\n        <\/div>\n        <div class=\"banner-content\">\n            <span class=\"banner-text-small\">\u0e23\u0e31\u0e1a\u0e1f\u0e31\u0e07\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e04\u0e38\u0e13\u0e20\u0e32\u0e1e<\/span>\n            <span class=\"banner-text-main\">\u0e27\u0e34\u0e17\u0e22\u0e38 \u0e2a\u0e27\u0e17.\u0e2a\u0e07\u0e02\u0e25\u0e32 \u0e1a\u0e19\u0e2d\u0e34\u0e19\u0e40\u0e15\u0e2d\u0e23\u0e4c\u0e40\u0e19\u0e47\u0e15<\/span>\n        <\/div>\n    <\/a>\n<\/section>\n\n\n\n<!DOCTYPE html>\n<html lang=\"th\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>Vertical Radio Player Embed (400&#215;600)<\/title>\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@400;600&#038;display=swap\" rel=\"stylesheet\">\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\"> \n\n    <style>\n        :root {\n            --primary-color: #f97316; \/* Orange - \u0e2a\u0e35\u0e43\u0e2b\u0e21\u0e48\u0e43\u0e2b\u0e49\u0e14\u0e39\u0e40\u0e14\u0e48\u0e19\u0e02\u0e36\u0e49\u0e19 *\/\n            --bg-color: #ffffff;\n            --secondary-bg-color: #f3f4f6;\n            --text-color: #1f2937;\n        }\n\n        \/* ******* Global & Layout Styles ******* *\/\n        body {\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            min-height: 100vh;\n            margin: 0;\n            background-color: var(--secondary-bg-color); \n        }\n        \n        .radio-player-container {\n            font-family: 'Kanit', sans-serif;\n            background-color: var(--bg-color);\n            \/* === \u0e01\u0e32\u0e23\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e15\u0e32\u0e21\u0e04\u0e33\u0e02\u0e2d (\u0e41\u0e19\u0e27\u0e15\u0e31\u0e49\u0e07) === *\/\n            width: 426px; \n            height: 715px;\n            \/* ================================== *\/\n            padding: 20px;\n            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);\n            border-radius: 16px;\n            display: flex;\n            flex-direction: column;\n            gap: 20px;\n            box-sizing: border-box;\n            overflow: hidden; \/* \u0e1b\u0e49\u0e2d\u0e07\u0e01\u0e31\u0e19\u0e40\u0e19\u0e37\u0e49\u0e2d\u0e2b\u0e32\u0e25\u0e49\u0e19 *\/\n        }\n\n        \/* --- 1. Station Selector (Scrollable Vertical List) --- *\/\n        .station-selector {\n            \/* \u0e1b\u0e23\u0e31\u0e1a\u0e43\u0e2b\u0e49\u0e43\u0e0a\u0e49\u0e1e\u0e37\u0e49\u0e19\u0e17\u0e35\u0e48\u0e2a\u0e48\u0e27\u0e19\u0e43\u0e2b\u0e0d\u0e48\u0e17\u0e35\u0e48\u0e40\u0e2b\u0e25\u0e37\u0e2d\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e01\u0e32\u0e23\u0e41\u0e2a\u0e14\u0e07\u0e2a\u0e16\u0e32\u0e19\u0e35 *\/\n            flex-grow: 1; \n            overflow-y: auto; \/* \u0e40\u0e1e\u0e34\u0e48\u0e21 Scrollbar \u0e2b\u0e32\u0e01\u0e21\u0e35\u0e2a\u0e16\u0e32\u0e19\u0e35\u0e21\u0e32\u0e01\u0e40\u0e01\u0e34\u0e19\u0e44\u0e1b *\/\n            display: flex;\n            flex-direction: column; \/* \u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e19\u0e27\u0e15\u0e31\u0e49\u0e07 *\/\n            gap: 15px; \n            padding: 5px; \/* Padding \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e43\u0e2b\u0e49 scrollbar \u0e44\u0e21\u0e48\u0e0a\u0e34\u0e14\u0e02\u0e2d\u0e1a *\/\n        }\n        \n        .station-item {\n            \/* **\u0e1b\u0e23\u0e31\u0e1a\u0e02\u0e19\u0e32\u0e14\u0e1b\u0e38\u0e48\u0e21\u0e2a\u0e16\u0e32\u0e19\u0e35\u0e43\u0e2b\u0e49\u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19\u0e41\u0e25\u0e30\u0e40\u0e2b\u0e47\u0e19\u0e0a\u0e31\u0e14\u0e40\u0e08\u0e19\u0e02\u0e36\u0e49\u0e19** *\/\n            display: flex;\n            flex-direction: row; \/* \u0e40\u0e23\u0e35\u0e22\u0e07 Icon \u0e41\u0e25\u0e30 Name \u0e43\u0e19\u0e41\u0e19\u0e27\u0e19\u0e2d\u0e19 *\/\n            align-items: center;\n            cursor: pointer;\n            text-align: left;\n            padding: 15px; \/* \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e1e\u0e37\u0e49\u0e19\u0e17\u0e35\u0e48 padding *\/\n            border-radius: 10px;\n            transition: background-color 0.2s, box-shadow 0.2s;\n            border: 2px solid transparent; \/* \u0e02\u0e2d\u0e1a\u0e2b\u0e19\u0e32\u0e02\u0e36\u0e49\u0e19 *\/\n        }\n\n        .station-item:hover {\n            background-color: #fff7ed; \/* Orange light hover *\/\n        }\n        \n        .station-item.active {\n            border-color: var(--primary-color);\n            background-color: #ffedd5; \/* Lightest Orange for active state *\/\n            box-shadow: 0 2px 4px rgba(249, 115, 22, 0.4);\n        }\n\n        .station-icon {\n            font-size: 36px; \/* Icon \u0e02\u0e19\u0e32\u0e14\u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 *\/\n            margin-right: 15px;\n            transition: transform 0.2s;\n            min-width: 36px; \/* \u0e01\u0e31\u0e19 icon \u0e40\u0e25\u0e47\u0e01\u0e40\u0e01\u0e34\u0e19\u0e44\u0e1b *\/\n            color: var(--primary-color); \/* \u0e43\u0e2b\u0e49 icon \u0e40\u0e1b\u0e47\u0e19\u0e2a\u0e35\u0e2b\u0e25\u0e31\u0e01 *\/\n            display: flex; \/* \u0e08\u0e31\u0e14 icon \u0e43\u0e2b\u0e49\u0e2d\u0e22\u0e39\u0e48\u0e01\u0e36\u0e48\u0e07\u0e01\u0e25\u0e32\u0e07 *\/\n            justify-content: center;\n            align-items: center;\n        }\n        \/* Style \u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a Emojis \u0e17\u0e35\u0e48\u0e43\u0e0a\u0e49\u0e40\u0e1b\u0e47\u0e19 Icon *\/\n        .station-item > span:first-child:not(.fa-solid) {\n             font-size: 36px;\n        }\n\n        .station-name {\n            font-size: 1.1em; \/* \u0e0a\u0e37\u0e48\u0e2d\u0e2a\u0e16\u0e32\u0e19\u0e35\u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 *\/\n            color: var(--text-color);\n            font-weight: 600;\n            white-space: normal;\n            line-height: 1.3;\n        }\n\n        \/* --- 2. Control Bar (\u0e14\u0e49\u0e32\u0e19\u0e25\u0e48\u0e32\u0e07\u0e2a\u0e38\u0e14) --- *\/\n        .control-bar {\n            display: flex;\n            flex-direction: column; \/* \u0e08\u0e31\u0e14 Control Bar \u0e43\u0e19\u0e41\u0e19\u0e27\u0e15\u0e31\u0e49\u0e07 *\/\n            gap: 15px;\n            padding-top: 15px;\n            border-top: 1px solid #e5e7eb;\n        }\n\n        .play-status-row {\n             display: flex;\n             align-items: center;\n             gap: 15px;\n        }\n\n        #main-play-pause-btn {\n            width: 55px; \/* \u0e1b\u0e38\u0e48\u0e21\u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 *\/\n            height: 55px; \/* \u0e1b\u0e38\u0e48\u0e21\u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 *\/\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            background-color: var(--primary-color);\n            color: white;\n            border: none;\n            border-radius: 50%;\n            font-size: 24px;\n            cursor: pointer;\n            transition: background-color 0.2s;\n            flex-shrink: 0;\n        }\n\n        #main-play-pause-btn:hover {\n            background-color: #ea580c;\n        }\n        \n        #current-status {\n            font-size: 1.1em;\n            font-weight: 700;\n            color: #059669; \/* Green for Playing *\/\n            flex-grow: 1;\n        }\n        \n        #current-status.paused {\n            color: #f59e0b; \/* Amber for Paused *\/\n        }\n\n        \/* Volume Control *\/\n        .volume-control {\n            display: flex;\n            align-items: center;\n            gap: 10px;\n            width: 100%;\n        }\n        \n        #volume-icon { \n            cursor: pointer; \n            font-size: 1.8em; \/* Icon \u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 *\/\n            color: #4b5563;\n            flex-shrink: 0;\n        }\n        \n        #volume-slider {\n            -webkit-appearance: none; appearance: none;\n            width: 100%; height: 10px; \/* Slider \u0e2b\u0e19\u0e32\u0e02\u0e36\u0e49\u0e19 *\/\n            background: #d1d5db; border-radius: 5px;\n            outline: none; cursor: pointer;\n        }\n        #volume-slider::-webkit-slider-thumb {\n            -webkit-appearance: none;\n            appearance: none;\n            width: 20px; \/* Thumb \u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 *\/\n            height: 20px; \/* Thumb \u0e43\u0e2b\u0e0d\u0e48\u0e02\u0e36\u0e49\u0e19 *\/\n            border-radius: 50%; \n            background: var(--primary-color);\n            cursor: pointer;\n            box-shadow: 0 0 4px rgba(0,0,0,0.4);\n        }\n        #volume-slider::-moz-range-thumb {\n            width: 20px;\n            height: 20px;\n            border-radius: 50%; \n            background: var(--primary-color);\n            cursor: pointer;\n            border: none;\n        }\n\n    <\/style>\n<\/head>\n<body>\n\n    <div class=\"radio-player-container\">\n        \n        <h3 style=\"margin: 0; color: var(--text-color);\">\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e17\u0e32\u0e07\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e1f\u0e31\u0e07\u0e2a\u0e16\u0e32\u0e19\u0e35\u0e27\u0e34\u0e17\u0e22\u0e38\u0e2d\u0e2d\u0e19\u0e44\u0e25\u0e19\u0e4c\u0e44\u0e14\u0e49\u0e21\u0e32\u0e01\u0e02\u0e36\u0e49\u0e19<\/h3>\n\n        <div class=\"station-selector\" id=\"station-selector\">\n            <div class=\"station-item\" data-url=\"https:\/\/media.onair.one:8170\/radio.mp3\" data-name=\"\u0e40\u0e1e\u0e25\u0e07\u0e44\u0e17\u0e22\u0e2a\u0e32\u0e01\u0e25\u0e23\u0e48\u0e27\u0e21\u0e2a\u0e21\u0e31\u0e22\">\n                <i class=\"fa-solid fa-broadcast-tower station-icon\"><\/i>\n                <span class=\"station-name\">\u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19 FM<\/span>\n            <\/div>\n            \n            <div class=\"station-item active\" data-url=\"https:\/\/media.onair.one:8170\/am2\" data-name=\"\u0e23\u0e30\u0e1a\u0e1a\u0e40\u0e2a\u0e35\u0e22\u0e07 \u0e40\u0e2d.\u0e40\u0e2d\u0e47\u0e21.\">\n                <span class=\"station-icon\">\ud83c\udfa7<\/span>\n                <span class=\"station-name\">\u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19 AM<\/span>\n            <\/div>\n\n            <div class=\"station-item\" data-url=\"https:\/\/radio-org-01-ott.prd.go.th\/ska_fm89_50\" data-name=\"MICE FM\">\n                <span class=\"station-icon\">\ud83d\udce1<\/span>\n                <span class=\"station-name\">\u0e2a\u0e27\u0e17. 89.5<\/span>\n            <\/div>\n            <div class=\"station-item\" data-url=\"https:\/\/radio-org-01-ott.prd.go.th\/ska_fm90_5\" data-name=\"\u0e2a\u0e16\u0e32\u0e19\u0e35\u0e02\u0e48\u0e32\u0e27\u0e17\u0e49\u0e2d\u0e07\u0e16\u0e34\u0e48\u0e19\">\n                <span class=\"station-icon\">\ud83d\udcf6<\/span>\n                <span class=\"station-name\">\u0e2a\u0e27\u0e17. 90.5<\/span>\n            <\/div>\n\n<div class=\"station-item\" data-url=\"https:\/\/media.onair.one:8170\/my\" data-name=\"\u0e44\u0e17\u0e22\u0e2a\u0e32\u0e01\u0e25\u0e22\u0e2d\u0e14\u0e19\u0e34\u0e22\u0e21\">\n                <span class=\"station-icon\">\ud83d\udcfb<\/span>\n                <span class=\"station-name\">onairPLUS 24 Hours<\/span>\n            <\/div>\n        <\/div>\n        \n        <audio id=\"radio-stream\" src=\"\" preload=\"none\"><\/audio>\n\n        <div class=\"control-bar\">\n            \n            <div class=\"play-status-row\">\n                <button id=\"main-play-pause-btn\">\n                    <i class=\"fa-solid fa-play play-icon\"><\/i>\n                    <i class=\"fa-solid fa-pause pause-icon\" style=\"display:none;\"><\/i>\n                <\/button>\n                <span id=\"current-status\" class=\"paused\">\n                    \u0e01\u0e14\u0e1b\u0e38\u0e48\u0e21 Play \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e40\u0e23\u0e34\u0e48\u0e21\u0e1f\u0e31\u0e07\n                <\/span>\n            <\/div>\n\n            <div class=\"volume-control\">\n                <i id=\"volume-icon\" class=\"fa-solid fa-volume-high\"><\/i>\n                <input type=\"range\" id=\"volume-slider\" min=\"0\" max=\"1\" step=\"0.01\" value=\"1\">\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <script>\n        const audio = document.getElementById('radio-stream');\n        const selectorContainer = document.getElementById('station-selector');\n        const playPauseBtn = document.getElementById('main-play-pause-btn');\n        const playIcon = document.querySelector('#main-play-pause-btn .play-icon');\n        const pauseIcon = document.querySelector('#main-play-pause-btn .pause-icon');\n        const statusDisplay = document.getElementById('current-status');\n        const volumeSlider = document.getElementById('volume-slider');\n        const volumeIcon = document.getElementById('volume-icon');\n\n        let audioContext;\n        let currentStationName = \"\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\"; \n        let lastVolume = 1;\n\n        \/\/ --- Utility Functions ---\n\n        const updateStatus = (isPlaying, stationName) => {\n            if (isPlaying) {\n                statusDisplay.textContent = `\u0e01\u0e33\u0e25\u0e31\u0e07\u0e1f\u0e31\u0e07: ${stationName}`;\n                statusDisplay.classList.remove('paused');\n            } else {\n                statusDisplay.textContent = `\u0e2b\u0e22\u0e38\u0e14: ${stationName}`;\n                statusDisplay.classList.add('paused');\n            }\n        };\n\n        const updateVolumeIcon = (volume) => {\n            if (volume === 0) {\n                volumeIcon.className = 'fa-solid fa-volume-xmark';\n            } else if (volume < 0.5) {\n                volumeIcon.className = 'fa-solid fa-volume-low';\n            } else {\n                volumeIcon.className = 'fa-solid fa-volume-high';\n            }\n        };\n\n        const setupAudioContext = () => {\n             \/\/ \u0e2a\u0e23\u0e49\u0e32\u0e07 AudioContext \u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e08\u0e31\u0e14\u0e01\u0e32\u0e23 Autoplay Policy\n            if (!audioContext) {\n                audioContext = new (window.AudioContext || window.webkitAudioContext)();\n            }\n        }\n        \n        const playStream = (stationName) => {\n            setupAudioContext();\n            \n            \/\/ Resume AudioContext \u0e40\u0e21\u0e37\u0e48\u0e2d\u0e21\u0e35\u0e01\u0e32\u0e23\u0e42\u0e15\u0e49\u0e15\u0e2d\u0e1a\n            if (audioContext.state === 'suspended') {\n                audioContext.resume();\n            }\n\n            audio.play()\n                .then(() => {\n                    playIcon.style.display = 'none';\n                    pauseIcon.style.display = 'inline';\n                    updateStatus(true, stationName);\n                })\n                .catch(e => {\n                    \/\/ \u0e2b\u0e32\u0e01\u0e40\u0e1a\u0e23\u0e32\u0e27\u0e4c\u0e40\u0e0b\u0e2d\u0e23\u0e4c\u0e1a\u0e25\u0e47\u0e2d\u0e01\u0e01\u0e32\u0e23\u0e40\u0e25\u0e48\u0e19\n                    console.error(\"Play error (Autoplay Blocked):\", e);\n                    statusDisplay.textContent = `\u274c \u0e15\u0e49\u0e2d\u0e07\u0e01\u0e14 Play \u0e2d\u0e35\u0e01\u0e04\u0e23\u0e31\u0e49\u0e07! (${stationName})`;\n                    statusDisplay.classList.add('paused');\n                    playIcon.style.display = 'inline';\n                    pauseIcon.style.display = 'none';\n                });\n        };\n        \n        \/\/ --- Initial Setup ---\n        document.addEventListener('DOMContentLoaded', () => {\n            const activeItem = document.querySelector('.station-item.active');\n            if (activeItem) {\n                audio.src = activeItem.dataset.url; \n                audio.volume = parseFloat(volumeSlider.value); \n                currentStationName = activeItem.dataset.name;\n                updateStatus(false, currentStationName); \/\/ \u0e2a\u0e16\u0e32\u0e19\u0e30\u0e40\u0e23\u0e34\u0e48\u0e21\u0e15\u0e49\u0e19\u0e04\u0e37\u0e2d Paused\n                updateVolumeIcon(audio.volume);\n            }\n        });\n\n        \/\/ --- Event Listeners ---\n\n        \/\/ 1. Station Selection (Click Icon\/Name and Play)\n        selectorContainer.addEventListener('click', (e) => {\n            const item = e.target.closest('.station-item');\n            if (!item) return;\n            \n            const newUrl = item.dataset.url;\n            const newName = item.dataset.name;\n\n            \/\/ 1. Update Active State\n            document.querySelectorAll('.station-item').forEach(i => i.classList.remove('active'));\n            item.classList.add('active');\n            \n            \/\/ 2. Load New Stream and Play\n            if (audio.src !== newUrl) {\n                audio.pause();\n                audio.src = newUrl;\n                audio.load();\n                currentStationName = newName;\n                playStream(newName); \/\/ \u0e40\u0e25\u0e48\u0e19\u0e2a\u0e16\u0e32\u0e19\u0e35\u0e43\u0e2b\u0e21\u0e48\u0e17\u0e31\u0e19\u0e17\u0e35\n            } else if (audio.paused) {\n                \/\/ \u0e16\u0e49\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e0a\u0e48\u0e2d\u0e07\u0e40\u0e14\u0e34\u0e21\u0e41\u0e15\u0e48\u0e2b\u0e22\u0e38\u0e14\u0e2d\u0e22\u0e39\u0e48 \u0e43\u0e2b\u0e49\u0e40\u0e25\u0e48\u0e19\u0e15\u0e48\u0e2d\n                currentStationName = newName; \/\/ \u0e2d\u0e31\u0e1e\u0e40\u0e14\u0e17\u0e0a\u0e37\u0e48\u0e2d\u0e2a\u0e16\u0e32\u0e19\u0e35 (\u0e41\u0e21\u0e49\u0e08\u0e30\u0e40\u0e1b\u0e47\u0e19\u0e0a\u0e48\u0e2d\u0e07\u0e40\u0e14\u0e34\u0e21)\n                playStream(newName); \n            }\n        });\n\n        \/\/ 2. Main Play\/Pause Button\n        playPauseBtn.addEventListener('click', () => {\n            if (audio.paused) {\n                playStream(currentStationName);\n            } else {\n                audio.pause();\n                playIcon.style.display = 'inline';\n                pauseIcon.style.display = 'none';\n                updateStatus(false, currentStationName);\n            }\n        });\n\n        \/\/ 3. Volume Handlers\n        volumeSlider.addEventListener('input', () => {\n            audio.volume = parseFloat(volumeSlider.value);\n            lastVolume = audio.volume;\n            updateVolumeIcon(audio.volume);\n        });\n\n        volumeIcon.addEventListener('click', () => {\n            if (audio.volume > 0) {\n                lastVolume = audio.volume; \n                audio.volume = 0;\n                volumeSlider.value = 0;\n            } else {\n                const newVolume = lastVolume > 0.05 ? lastVolume : 0.5;\n                audio.volume = newVolume;\n                volumeSlider.value = newVolume;\n            }\n            updateVolumeIcon(audio.volume);\n        });\n\n        \/\/ 4. Update UI on Audio Events\n        audio.addEventListener('pause', () => {\n            if (audio.currentTime > 0) { \n                playIcon.style.display = 'inline';\n                pauseIcon.style.display = 'none';\n                updateStatus(false, currentStationName);\n            }\n        });\n        \n        audio.addEventListener('play', () => {\n            playIcon.style.display = 'none';\n            pauseIcon.style.display = 'inline';\n            updateStatus(true, currentStationName);\n        });\n\n        \/\/ 5. Handle loading errors\n        audio.addEventListener('error', (e) => {\n            console.error('Audio playback error:', e);\n            audio.pause();\n            playIcon.style.display = 'inline';\n            pauseIcon.style.display = 'none';\n            statusDisplay.textContent = `\ud83d\udeab \u0e25\u0e34\u0e07\u0e01\u0e4c\u0e40\u0e2a\u0e35\u0e22\/\u0e42\u0e2b\u0e25\u0e14\u0e44\u0e21\u0e48\u0e44\u0e14\u0e49: ${currentStationName}`;\n            statusDisplay.classList.add('paused');\n        });\n    <\/script>\n<\/body>\n<\/html>\n<\/div>\n<\/div>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading has-text-align-center\">\u0e04\u0e25\u0e34\u0e01\u0e1f\u0e31\u0e07\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e27\u0e34\u0e17\u0e22\u0e38\u0e41\u0e25\u0e30\u0e0a\u0e48\u0e2d\u0e07\u0e40\u0e1e\u0e25\u0e07\u0e2d\u0e22\u0e48\u0e32\u0e07\u0e15\u0e48\u0e2d\u0e40\u0e19\u0e37\u0e48\u0e2d\u0e07\u0e15\u0e25\u0e2d\u0e14 24 \u0e0a\u0e31\u0e48\u0e27\u0e42\u0e21\u0e07\u0e08\u0e32\u0e01 onairPLUS \u0e44\u0e14\u0e49\u0e17\u0e35\u0e48\u0e19\u0e35\u0e48<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<center><a href=\"https:\/\/lin.ee\/mkzBoK4\"><img decoding=\"async\" src=\"https:\/\/www.onairhatyai.com\/wp-content\/uploads\/2024\/08\/thLINE.png\" alt=\"\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e19\u0e1a\u0e19\u0e44\u0e25\u0e19\u0e4c\u0e44\u0e14\u0e49\u0e17\u0e35\u0e48\u0e19\u0e35\u0e48\" height=\"36\" border=\"0\"><\/a>\n<\/center>\n\n\n\n<h2 class=\"wp-block-heading has-text-align-center\">Line OA @onairFM<\/h2>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<center><a href=\"https:\/\/apple.co\/2X7bZS7\"><img decoding=\"async\" src=\"https:\/\/www.onairhatyai.com\/wp-content\/uploads\/2024\/08\/25bf6eb6adcdcf482ac91fae62b0229e_L_0.jpg\" alt=\"\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e19\u0e1a\u0e19\u0e44\u0e25\u0e19\u0e4c \u0e04\u0e25\u0e34\u0e01\u0e17\u0e35\u0e48\u0e19\u0e35\u0e48\" height=\"30\" border=\"0\"><\/a>\n<\/center>\n\n\n\n<h2 class=\"wp-block-heading has-text-align-center\">App onairPLUS iOS<\/h2>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<center><a href=\"https:\/\/onair.one\/appand\"><img decoding=\"async\" src=\"https:\/\/www.onairhatyai.com\/wp-content\/uploads\/2024\/08\/linerichmenu-2022-05-23T145322.768.jpg\" alt=\"\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e19\u0e1a\u0e19\u0e44\u0e25\u0e19\u0e4c \u0e04\u0e25\u0e34\u0e01\u0e17\u0e35\u0e48\u0e19\u0e35\u0e48\" height=\"30\" border=\"0\"><\/a>\n<\/center>\n\n\n\n<h2 class=\"wp-block-heading has-text-align-center\">App onairPLUS android OS<\/h2>\n<\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><a href=\"https:\/\/onair.one\/fm-89-5-mhz-\u0e2a\u0e27\u0e17-\u0e2a\u0e07\u0e02\u0e25\u0e32\/\">\u0e2a\u0e16\u0e32\u0e19\u0e35\u0e27\u0e34\u0e17\u0e22\u0e38\u0e01\u0e23\u0e30\u0e08\u0e32\u0e22\u0e40\u0e2a\u0e35\u0e22\u0e07\u0e41\u0e2b\u0e48\u0e07\u0e1b\u0e23\u0e30\u0e40\u0e17\u0e28\u0e44\u0e17\u0e22\u0e08\u0e31\u0e07\u0e2b\u0e27\u0e31\u0e14\u0e2a\u0e07\u0e02\u0e25\u0e32 FM 89.50 MHz<\/a><\/h2>\n\n\n\n<h2 class=\"wp-block-heading\">| <a href=\"https:\/\/onair.one\/fm-89-5-mhz-%E0%B8%AA%E0%B8%A7%E0%B8%97-%E0%B8%AA%E0%B8%87%E0%B8%82%E0%B8%A5%E0%B8%B2\/\">FM 89.5 MHz<\/a> | <a href=\"https:\/\/onair.one\/fm-89-5-mhz-%E0%B8%AA%E0%B8%A7%E0%B8%97-%E0%B8%AA%E0%B8%87%E0%B8%82%E0%B8%A5%E0%B8%B2\/\">FM 90.5 MHz<\/a> | HD Radio DIGITAL SOUND<\/h2>\n\n\n\n<h2 class=\"wp-block-heading has-white-color has-vivid-red-background-color has-text-color has-background has-link-color wp-elements-275f97f960606db86f468920550762a4\">For Listening Radio Online Portal in Thailand Only, <strong>Unofficial Website<\/strong>.<br>More info please call. (+66) 062 629 7789<\/h2>\n\n\n\n<hr class=\"wp-block-separator has-css-opacity\"\/>\n\n\n\n<script language=\"javascript\"> document.onselectstart=new Function('return false'); function ds(e){return false;} function ra(){return true;} document.onmousedown=ds; document.onclick=ra; document.oncontextmenu = function (){ return false}; <\/script><br> <br> <script language=\"JavaScript\"> if (top.location != self.location) {top.location = self.location} <\/script>\n","protected":false},"excerpt":{"rendered":"<p>34 \u0e1b\u0e35 \u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e27\u0e34\u0e17\u0e22\u0e38 &#8220;\u0e14\u0e19\u0e15\u0e23\u0e35\u0e2a\u0e35\u0e2a\u0e31\u0e19&#8221; \u0e17\u0e35\u0e48\u0e2d\u0e2d\u0e01\u0e2d [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-93","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/onairhatyai.com\/index.php?rest_route=\/wp\/v2\/pages\/93","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/onairhatyai.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/onairhatyai.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/onairhatyai.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/onairhatyai.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=93"}],"version-history":[{"count":782,"href":"https:\/\/onairhatyai.com\/index.php?rest_route=\/wp\/v2\/pages\/93\/revisions"}],"predecessor-version":[{"id":3157,"href":"https:\/\/onairhatyai.com\/index.php?rest_route=\/wp\/v2\/pages\/93\/revisions\/3157"}],"wp:attachment":[{"href":"https:\/\/onairhatyai.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=93"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}