DO NOT USE FOR STORY GENERATION – USE THE CLONE INSTEAD
Key Changes Made needs updating for true and false tooltip
- Added translation tooltip to the “用你自己的话写这个故事” instruction in the Retell section
- Added English translation tooltips to all questions using the vocab-tooltip class
- Placed answer tooltips (💡) immediately after each question
- For Multiple Choice: answer tooltip appears right after the question, before the a, b, c options, and includes both the letter and full answer text in the format “Answer: X) Full answer text”
- Added empty rows between Multiple Choice answer pairs in the table using
- Applied the same tooltip structure to True/False and Retell sections
Here come the level and word count
body { font-family: Arial, sans-serif; margin: 0; padding: 0; background-color: #fdfdfd; } .container { max-width: 900px; margin: 20px auto; padding: 0 15px; } .tab-group { margin: 25px 0; } .tab-buttons { display: flex; justify-content: space-around; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; } .tab-buttons button { padding: 10px 18px; cursor: pointer; background-color: #ffe082; border: none; border-radius: 6px; font-weight: bold; } .tab-buttons button.active { background-color: #ffca28; } .tab-content { display: none; background-color: #fff8e1; padding: 20px; border-radius: 10px; box-shadow: 0 2px 6px rgba(0,0,0,0.1); } .tab-content.active { display: block; } h2 { color: #2e7d32; margin-top: 0; } textarea { width: 100%; padding: 10px; border-radius: 6px; border: 1px solid #ccc; } .vocab-tooltip { border-bottom: 1px dotted #333; cursor: help; font-weight: bold; color: #2e7d32; } .vocab-tooltip:hover::after { content: attr(data-tooltip); position: absolute; background: #333; color: white; padding: 5px 10px; border-radius: 4px; font-size: 12px; white-space: nowrap; transform: translate(-50%, -120%); } .answer-tooltip { border-bottom: 1px dotted #666; cursor: help; font-weight: bold; color: #1976d2; } .answer-tooltip:hover::after { content: attr(data-answer); position: absolute; background: #1976d2; color: white; padding: 8px 12px; border-radius: 4px; font-size: 13px; white-space: nowrap; transform: translate(-50%, -120%); } panel inside the story tab-group. STUDY TABS 1) Vocabulary – Exactly 10 words from the story. – Provide in a 3-column table: Characters | Pinyin | English – NO tooltips in the Vocabulary table. 2) Grammar – Exactly 2 grammar rules that appear in the story. – Explanations MUST be in English only (3–5 lines each). – If any Chinese characters appear in the Grammar tab (especially in examples), wrap them in tooltips with Pinyin + English. – Examples: – Must be grouped under one header: “Examples:” (per rule). – Provide 2–3 examples per rule, copied from the story. – Examples MUST be in characters, italic, and tooltipped with full Pinyin + full English translation: data-tooltip=”full pinyin — full English” 3) Idiomatic Expressions – Exactly 5 idioms/expressions. – Each item must include: – Idiom characters tooltipped with Pinyin + English. – A 2–3 sentence description in English (do NOT start with “Explanation:”). – One example sentence in characters (use from story if possible); tooltip the example with full pinyin + full English. 4) Cultural Insights – Max 5 cultural points; each 3–5 lines. – Text is English, but ANY Chinese characters included MUST be tooltipped with Pinyin + English. EXERCISES (ALL IN CHINESE) A) 10 Questions – Exactly 10 questions in Chinese. – Tooltip EACH question with full Pinyin + full English: data-tooltip=”full pinyin — full English” – Provide the answer as a tooltip containing Characters + Pinyin + English (all in one tooltip string): data-answer=”汉字 — pinyin — English” B) Multiple Choice – Exactly 6 unique questions. – Display in 2 columns using a table (no visible lines), 3 questions per column. – Tooltip each question with full Pinyin + full English. – Correct answer hidden in a tooltip containing Characters + Pinyin + English. C) True or False – Minimum 6 statements in Chinese. – Tooltip each statement with full pinyin + full English. – Provide the answer as a tooltip containing Characters + Pinyin + English. D) Retell – Prompt learner in Chinese to rewrite the story in their own words. – Tooltip the retell prompt with Pinyin + English. REMOVE ALL REFERENCES – No citations/links/references outside your site. NOW GENERATE THE CONTENT USING THIS TEMPLATE EXACTLY (FILL ALL PLACEHOLDERS). –>
document.querySelectorAll(‘.tab-group’).forEach(group => {
const buttons = group.querySelectorAll(‘.tab-btn’);
const contents = group.querySelectorAll(‘.tab-content’);
buttons.forEach(button => {
button.addEventListener(‘click’, () => {
buttons.forEach(btn => btn.classList.remove(‘active’));
contents.forEach(content => content.classList.remove(‘active’));
button.classList.add(‘active’);
document.getElementById(button.dataset.tab).classList.add(‘active’);
});
});
});
s01hsk1w01d02
去超市买东西 – Going to the Supermarket
Summary (EN): After class, a student goes to a supermarket near home, buys water, apples, and bread, asks how much it costs, and pays at the counter. Then the student goes home happy.
LEVEL/WORDCOUNT: HSK1 / ~170 characters
去超市买东西
今天下课以后，我回家。路上，我去超市买东西。
我要买水，也要买苹果和面包。我看了看，苹果很好。
我问售货员：“这个多少钱？”售货员说：“一共十块。”
我说：“好。”我在收银台付钱。然后我拿着东西回家，心里很开心。
Qù Chāoshì Mǎi Dōngxi (Pinyin)
Jīntiān xiàkè yǐhòu, wǒ huí jiā. Lùshang, wǒ qù chāoshì mǎi dōngxi.
Wǒ yào mǎi shuǐ, yě yào mǎi píngguǒ hé miànbāo. Wǒ kàn le kàn, píngguǒ hěn hǎo.
Wǒ wèn shòuhuòyuán: “Zhège duōshao qián?” Shòuhuòyuán shuō: “Yígòng shí kuài.”
Wǒ shuō: “Hǎo.” Wǒ zài shōuyíntái fù qián. Ránhòu wǒ ná zhe dōngxi huí jiā, xīnlǐ hěn kāixīn.
Going to the Supermarket
After class today, I go home. On the way, I go to the supermarket to buy things.
I want to buy water, and I also want to buy apples and bread. I take a look, and the apples are very good.
I ask the shop assistant, “How much is this?” The shop assistant says, “Altogether it’s ten yuan.”
I say, “Okay.” I pay at the checkout counter. Then I take the things home, and I feel very happy.
Help
How to Use the Audio
The audio is designed to help you improve your Mandarin Chinese listening skills and pronunciation. You can use it in two ways:
- Before reading: Listen to understand rhythm, intonation, and natural speech.
- After reading: Listen again to compare pronunciation and improve fluency.
Vocabulary
| Characters | Pinyin | English |
|---|---|---|
| 家 | jiā | home |
| 超市 | chāoshì | supermarket |
| 东西 | dōngxi | things; items |
| 要 | yào | to want; to need |
| 水 | shuǐ | water |
| 苹果 | píngguǒ | apple |
| 面包 | miànbāo | bread |
| 售货员 | shòuhuòyuán | shop assistant; cashier |
| 十块 | shí kuài | ten yuan |
| 收银台 | shōuyíntái | checkout counter |
Grammar
Grammar rule #1: “要 + Verb” (want/need to do something)
Use 要 before a verb to say what you want or need to do.
This is common for shopping, ordering, and making simple plans.
You can repeat it to list items, making the sentence clear and beginner-friendly.
Examples:
我要买水。
也要买苹果和面包。
Grammar rule #2: “一共 + Amount” (total amount)
Use 一共 to show the total number or total price.
It often appears when paying, counting, or adding items together.
Put the amount after it to answer “How much in total?”.
Examples:
一共十块。
这个多少钱？
Idiomatic Expressions
- 路上
A practical phrase meaning “on the way” from one place to another. It is often used to describe something you do while traveling somewhere.
It sounds natural in daily routines, like stopping by a store on the way home.
Example: 路上，我去超市买东西。 - 看了看
This reduplication shows a quick, casual action: taking a brief look. It often implies the action is light and not very long.
It is common when shopping, checking signs, or looking for something.
Example: 我看了看，苹果很好。 - 多少钱
A core phrase for shopping and daily life, used to ask the price of something. It is direct, clear, and widely understood.
It can be used in markets, stores, restaurants, and online shopping.
Example: 这个多少钱？ - 一共
A very common expression for totals, especially at checkout. It helps you understand the final amount after adding items.
It often appears in short, useful answers from cashiers.
Example: 一共十块。 - 心里
This phrase describes feelings “inside” someone, in their heart or mind. It is often used to express emotions after an event.
At beginner level, it frequently pairs with emotions like 开心 or 高兴.
Example: 心里很开心。
Cultural Insights
- Paying at the checkout
In many Chinese supermarkets, you choose items and then pay at the 收银台 at the front.
Cashiers often say the total using 一共, making it a very practical word to learn.
Digital payments are common, but paying methods vary by place and store.
- Using “块” for money
块 is a casual spoken way to say yuan (RMB). It is used constantly in daily conversation for prices.
Beginners will hear “十块” much more often than the more formal “十元”.
Knowing both helps you understand signs and real conversations.
- Buying fruit and staples
Items like 苹果, bottled 水, and 面包 are common everyday purchases in city life.
Supermarkets often have fresh fruit sections near the entrance or along the main aisles.
Shoppers may quickly compare quality by “looking around” and choosing the best-looking items.
- Talking to store staff
In smaller shops, you might talk to a 售货员 for help, prices, or recommendations.
Simple questions like “这个多少钱？” are considered normal and polite.
Adding “请” can sound even more polite, especially when asking for assistance.
- Routine storytelling style
Beginner stories often use time phrases like “下课以后” and sequence words like “然后” to keep meaning clear.
This mirrors how many learners practice short diary-like descriptions of a day.
Repeating simple structures helps build fluency and confidence.
10 Questions
- 他/她下课以后去哪里？ (答案)
- 他/她路上去了哪里？ (答案)
- 他/她去超市做什么？ (答案)
- 他/她要买什么？ (答案)
- 他/她觉得苹果怎么样？ (答案)
- 他/她问售货员什么？ (答案)
- 一共多少钱？ (答案)
- 他/她在哪里付钱？ (答案)
- 他/她拿着什么回家？ (答案)
- 他/她心里怎么样？ (答案)
Multiple Choice
|
text
|
True or False
- 他/她路上去超市。 (答案)
- 他/她要买茶。 (答案)
- 他/她要买水。 (答案)
- 他/她要买苹果和面包。 (答案)
- 售货员说一共十块。 (答案)
- 他/她在家付钱。 (答案)
- 他/她付钱后回家。 (答案)
Retell the Story
请用你自己的话重写这个故事。
Leave a Reply